/* div#CybotCookiebotDialog { --background-color: var(--base-color-black); --color: var(--base-color-white); --link-color: var(--base-color-white); --headline-color: var(--base-color-dark-purple); --button-background-color: var(--base-color-yellow); --button-hover-background-color: var(--base-color-yellow); --button-border-radius: 0; --button-color: var(--base-color-black); --button-hover-color: var(--base-color-black); background: var(--background-color) !important; box-shadow: 4px 4px 8px 0 rgba(0,0,0,0.2) !important; border-radius: 0 !important; top: auto !important; left: auto !important; right: var(--page-padding-right) !important; bottom: var(--page-padding-right) !important; transform: none !important; width: calc(100% - var(--page-padding-left) - var(--page-padding-right)) !important; max-width: 650px !important; max-height: calc(100% - var(--page-padding-left) - var(--page-padding-right)) !important; font-family: var(--base-font-1-regular) !important; color: var(--color) !important; line-height: 1.125 !important; z-index: 100 !important; } #CybotCookiebotDialog a, #CybotCookiebotDialog div { font-family: var(--base-font-1-regular) !important; } #CybotCookiebotDialog *, #CybotCookiebotDialogBodyUnderlay * { font-size: 16px !important; } div#CybotCookiebotDialog * { color: var(--color) !important; } div#CybotCookiebotDialog #CybotCookiebotDialogHeader { display: none !important; } div#CybotCookiebotDialog #CybotCookiebotDialogPoweredByText { display: none !important; } #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink, #CybotCookiebotDialog h2, #CybotCookiebotDialogDetailBodyContentCookieContainerTypes .CybotCookiebotDialogDetailBodyEmptyCategoryMessage { font-weight: normal !important; font-family: var(--base-font-1-demi) !important; } #CybotCookiebotDialog h2 { font-weight: normal !important; font-family: var(--base-font-1-demi) !important; font-size: 22px !important; } div#CybotCookiebotDialog * { letter-spacing: 0 !important; } #CybotCookiebotDialog, #CybotCookiebotDialog :after, #CybotCookiebotDialog :before, #CybotCookiebotDialog:after, #CybotCookiebotDialog:before, #CybotCookiebotDialogBody *, #CybotCookiebotDialogDetail * { box-sizing: border-box !important; } #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink { border-color: transparent !important; } #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive { color: var(--color) !important; border-color: var(--color) !important; } #CybotCookiebotDialog .CybotCookiebotScrollContainer { border-bottom: 0 !important; } #CybotCookiebotDialogBodyContent { padding: 24px 24px 12px 24px !important; } #CybotCookiebotDialogBodyButtons { padding: 0px 24px 24px 24px !important; margin: 0 !important; } #CybotCookiebotDialogDetailBodyContentTextAbout { padding-inline: 0 !important; } #CybotCookiebotDialogDetailBody { padding-inline: 24px !important; max-width: none !important; } .CybotCookiebotDialogDetailBodyContentTab { background: var(--base-color-black) !important; } .CybotCookiebotDialogDetailBodyContentCookieContainerTypes, .CybotCookiebotDialogDetailBodyContentIABv2Tab, .CybotCookiebotDialogDetailBodyContentCookieContainerTypesSelected, .CybotCookiebotDialogDetailBodyContentIABv2TabSelected, .CybotCookiebotDialogDetailBodyContentTabsItem, .CybotCookiebotDialogDetailBodyContentTabsItemSelected { padding-left: 0 !important; } #CybotCookiebotDialog a.CybotCookiebotDialogDetailBodyContentCookieContainerTypes:focus, #CybotCookiebotDialog a.CybotCookiebotDialogDetailBodyContentCookieContainerTypes:hover, #CybotCookiebotDialog a.CybotCookiebotDialogDetailBodyContentIABv2Tab:focus, #CybotCookiebotDialog a.CybotCookiebotDialogDetailBodyContentIABv2Tab:hover { background: var(--base-color-off-black) !important; } #CybotCookiebotDialog .CybotCookiebotDialogDetailBodyContentTabsItemSelected, #CybotCookiebotDialog .CybotCookiebotDialogDetailBodyContentCookieContainerTypesSelected, #CybotCookiebotDialog .CybotCookiebotDialogDetailBodyContentIABv2TabSelected { text-decoration: underline !important; } #CybotCookiebotDialogDetail, #CybotCookiebotDialogDetailBody, #CybotCookiebotDialogDetailBodyContent, #CybotCookiebotDialogDetailFooter, #CybotCookiebotDialogDetailBodyContentTabs a, #CybotCookiebotDialogDetailBodyContent, .CybotCookiebotDialogDetailBodyContentCookieContainerTypes, .CybotCookiebotDialogDetailBodyContentIABv2Tab, .CybotCookiebotDialogDetailBodyContentCookieContainerTypesSelected, .CybotCookiebotDialogDetailBodyContentIABv2TabSelected { background: var(--base-color-off-black) !important; border: 0 !important; border-radius: none !important; } #CybotCookiebotDialogDetail * { font-size: 14px !important; } #CybotCookiebotDialogBodyContentTitle { margin-bottom: 0.5em !important; } #CybotCookiebotDialog #CybotCookiebotDialogBodyContentText a, #CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonIABHeaderViewPartnersLink, #CybotCookiebotDialog #CybotCookiebotDialogDetailBulkConsentList dt a, #CybotCookiebotDialog #CybotCookiebotDialogDetailFooter a, #CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonIABDescription a, #CybotCookiebotDialog .CybotCookiebotDialogDetailBodyContentCookieLink, #CybotCookiebotDialogDetailBodyContentTextAbout a { font-weight: normal !important; font-family: var(--base-font-1-demi) !important; color: var(--link-color) !important; } #CybotCookiebotDialog .CookieCard .CybotCookiebotDialogDetailBodyContentCookieContainerButton, #CybotCookiebotDialog .CookieCard .CybotCookiebotDialogDetailBodyContentIABv2Tab { font-weight: normal !important; font-family: var(--base-font-1-black) !important; } #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive { border-width: 3px !important; } #CybotCookiebotDialogBodyButtons .CybotCookiebotDialogBodyButton { border: 0 !important; background: var(--button-background-color) !important; border-radius: var(--button-border-radius) !important; color: var(--button-color) !important; font-family: var(--base-font-1-demi) !important; font-weight: normal !important; display: inline-block !important; width: auto !important; padding: 0.2em 0.5em !important; line-height: 1.3 !important; text-transform: uppercase !important; } #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton:hover { background: var(--button-hover-background-color) !important; opacity: 1 !important; } #CybotCookiebotDialog .CybotCookiebotDialogHide { display: none !important; } #CybotCookiebotDialog .CybotCookiebotDialogShow { display: block !important; } #CybotCookiebotDialog #CybotCookiebotDialogTabContentDetails .CybotCookiebotFader.CybotCookiebotDialogActive { background-image: linear-gradient(to top, var(--background-color), var(--background-color), transparent) !important; } #CybotCookiebotDialogDetailBodyContentCookieContainerTypes .CybotCookiebotDialogDetailBodyEmptyCategoryMessage { padding: 0.5em 0.75em !important; border-radius: 0 !important; }*/ .wysiwyg .CookieDeclarationType { font-size: inherit !important; overflow: auto; position: relative; padding: 1em !important; margin-left: -1em !important; margin-right: -1em !important; border: 1px solid rgba(0,0,0,0.2) !important; } .CookieDeclarationTable { width: 100% !important; } .CookieDeclarationTable thead, .CookieDeclarationTable colgroup { display: none; } .CookieDeclarationTable tbody tr { display: block; width: 100%; padding: 0.35em 0.75em; background: transparent; box-sizing: border-box; line-height: 1.2; } .CookieDeclarationTable tbody tr:not(:last-child) { margin-bottom: .5em; } .CookieDeclarationTable tbody td { display: block; width: 100%; padding-left: 6.25em !important; position: relative; border: 0 !important; box-sizing: border-box !important; max-width: none !important; } .CookieDeclarationTable tbody td::before { content: attr(data-label); display: inline-block; font-family: var(--base-font-1-demi) !important; font-weight: 400; position: absolute; left: 0; } .CookieDeclarationTypeHeader { font-family: var(--base-font-1-demi) !important; font-weight: 400 !important; } .cookieconsent-placeholder > div { background: #e3ebeb; padding: 1.5em; } .cookieconsent-placeholder .btn-set { margin-top: 1.9em; } .cookieconsent-placeholder .headline { margin-bottom: .6em; } .cookieconsent-placeholder[data-accepted="false"] + .embed-wrap { display: none; }@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:calc(10px * 2);padding:calc(var(--plyr-control-spacing,10px) * 2)}}@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(calc(10px * -4));transform:translateY(calc(var(--plyr-control-spacing,10px) * -4))}.plyr__caption{background:rgba(0,0,0,.8);background:var(--plyr-captions-background,rgba(0,0,0,.8));border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__caption div{display:inline}.plyr__control{background:0 0;border:0;border-radius:3px;border-radius:var(--plyr-control-radius,3px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7);position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}a.plyr__control{text-decoration:none}a.plyr__control::after,a.plyr__control::before{display:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:calc(10px / 4);margin-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:calc(10px / 4);padding-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item.plyr__time{padding:0 calc(10px / 2);padding:0 calc(var(--plyr-control-spacing,10px)/ 2)}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr__controls:empty{display:none}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);background:var(--plyr-menu-background,rgba(255,255,255,.9));border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-menu-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border:var(--plyr-menu-arrow-size,4px) solid transparent;border-top-color:rgba(255,255,255,.9);border-top-color:var(--plyr-menu-background,rgba(255,255,255,.9));content:'';height:0;position:absolute;right:calc(((18px / 2) + calc(10px * .7)) - (4px / 2));right:calc(((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7)) - (var(--plyr-menu-arrow-size,4px)/ 2));top:100%;width:0}.plyr__menu__container [role=menu]{padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding-bottom:calc(calc(10px * .7)/ 1.5);padding-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);padding-left:calc(calc(10px * .7) * 1.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-right:calc(calc(10px * .7) * 1.5);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-top:calc(calc(10px * .7)/ 1.5);padding-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;border:var(--plyr-menu-item-arrow-size,4px) solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:calc(calc(10px * .7) * 4);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4)}.plyr__menu__container .plyr__control--forward::after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:calc((calc(10px * .7) * 1.5) - 4px);right:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:calc(10px * .7);margin:calc(var(--plyr-control-spacing,10px) * .7);margin-bottom:calc(calc(10px * .7)/ 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);padding-left:calc(calc(10px * .7) * 4);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4);position:relative;width:calc(100% - (calc(10px * .7) * 2));width:calc(100% - (calc(var(--plyr-control-spacing,10px) * .7) * 2))}.plyr__menu__container .plyr__control--back::after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:calc((calc(10px * .7) * 1.5) - 4px);left:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--back::before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:'';height:1px;left:0;margin-top:calc(calc(10px * .7)/ 2);margin-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:calc(10px * .7);padding-left:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container .plyr__control[role=menuitemradio]::after,.plyr__menu__container .plyr__control[role=menuitemradio]::before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]::before{background:rgba(0,0,0,.1);content:'';display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]::after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{background:#00b3ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)))}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover::before{background:rgba(35,40,47,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:calc((calc(10px * .7) - 2) * -1);margin-right:calc((calc(var(--plyr-control-spacing,10px) * .7) - 2) * -1);overflow:hidden;padding-left:calc(calc(10px * .7) * 3.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 3.5);pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:calc(13px * 2);border-radius:calc(var(--plyr-range-thumb-height,13px) * 2);color:#00b3ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));display:block;height:calc((3px * 2) + 13px);height:calc((var(--plyr-range-thumb-active-shadow-width,3px) * 2) + var(--plyr-range-thumb-height,13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor 0,transparent 0);background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);-webkit-appearance:none;margin-top:calc(((13px - 5px)/ 2) * -1);margin-top:calc(((var(--plyr-range-thumb-height,13px) - var(--plyr-range-track-height,5px))/ 2) * -1)}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px)}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr__poster{background-color:#000;background-color:var(--plyr-video-background,var(--plyr-video-background,#000));background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}@media (max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:rgba(255,255,255,.9);background:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;border-radius:var(--plyr-tooltip-radius,3px);bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:calc(10px / 2) calc(calc(10px / 2) * 1.5);padding:calc(var(--plyr-control-spacing,10px)/ 2) calc(calc(var(--plyr-control-spacing,10px)/ 2) * 1.5);pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:calc((18px / 2) + calc(10px * .7));left:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7))}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:calc((18px / 2) + calc(10px * .7));right:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7));transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr__progress{left:calc(13px * .5);left:calc(var(--plyr-range-thumb-height,13px) * .5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:calc(13px * -.5);margin-left:calc(var(--plyr-range-thumb-height,13px) * -.5);margin-right:calc(13px * -.5);margin-right:calc(var(--plyr-range-thumb-height,13px) * -.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height,13px))}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:calc((5px / 2) * -1);margin-top:calc((var(--plyr-range-track-height,5px)/ 2) * -1);padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(35,40,47,.6) 25%,transparent 25%,transparent 50%,rgba(35,40,47,.6) 50%,rgba(35,40,47,.6) 75%,transparent 75%,transparent);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 25%,transparent 25%,transparent 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr__volume{align-items:center;display:flex;max-width:110px;min-width:80px;position:relative;width:20%}.plyr__volume input[type=range]{margin-left:calc(10px / 2);margin-left:calc(var(--plyr-control-spacing,10px)/ 2);margin-right:calc(10px / 2);margin-right:calc(var(--plyr-control-spacing,10px)/ 2);position:relative;z-index:2}.plyr--is-ios .plyr__volume{min-width:0;width:auto}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--audio .plyr__progress__buffer{color:rgba(193,200,209,.6);color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr--video{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));height:100%;margin:auto;overflow:hidden;position:relative;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;left:0;position:absolute;top:0}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75));background:var(--plyr-video-controls-background,linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75)));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:calc(10px / 2);padding:calc(var(--plyr-control-spacing,10px)/ 2);padding-top:calc(10px * 2);padding-top:calc(var(--plyr-control-spacing,10px) * 2);position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:calc(10px * 3.5);padding-top:calc(var(--plyr-control-spacing,10px) * 3.5)}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control.plyr__tab-focus,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}.plyr__control--overlaid{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:calc(10px * 1.5);padding:calc(var(--plyr-control-spacing,10px) * 1.5);position:absolute;top:50%;transform:translate(-50%,-50%);transition:.3s;z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--video .plyr__progress__buffer{color:rgba(255,255,255,.25);color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;position:static}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin:-var(--plyr-range-track-height,5px)/2 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr__preview-thumb{background-color:rgba(255,255,255,.9);background-color:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:3px;padding:var(--plyr-tooltip-radius,3px);pointer-events:none;position:absolute;transform:translate(0,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0,0) scale(1)}.plyr__preview-thumb::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img{height:100%;left:0;max-height:none;max-width:none;position:absolute;top:0;width:100%}.plyr__preview-thumb__time-container{bottom:6px;left:0;position:absolute;right:0;white-space:nowrap;z-index:3}.plyr__preview-thumb__time-container span{background-color:rgba(0,0,0,.55);border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));padding:3px 6px}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide--draggable>.splide__slider>.splide__track,.splide--draggable>.splide__track{-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide--fade>.splide__slider>.splide__track>.splide__list,.splide--fade>.splide__track>.splide__list{display:block}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide,.splide--fade>.splide__track>.splide__list>.splide__slide{left:0;opacity:0;position:absolute;top:0;z-index:0}.splide--fade>.splide__slider>.splide__track>.splide__list>.splide__slide.is-active,.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{opacity:1;position:relative;z-index:1}.splide--rtl{direction:rtl}.splide--ttb.is-active>.splide__slider>.splide__track>.splide__list,.splide--ttb.is-active>.splide__track>.splide__list{display:block}.splide__container{box-sizing:border-box;position:relative}.splide__list{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important;transform-style:preserve-3d}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide__progress__bar{width:0}.splide{outline:none;position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;outline:none;position:relative}.splide__slide img{vertical-align:bottom}.splide__slider{position:relative}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__track{overflow:hidden;position:relative;z-index:0}@font-face { font-family: 'fontello'; src: url('/content/themes/isicargo/fontello/font/fontello.eot?28302404&x61486'); src: url('/content/themes/isicargo/fontello/font/fontello.eot?28302404#iefix&x61486') format('embedded-opentype'), url('/content/themes/isicargo/fontello/font/fontello.woff2?28302404') format('woff2'), url('/content/themes/isicargo/fontello/font/fontello.woff?28302404&x61486') format('woff'), url('/content/themes/isicargo/fontello/font/fontello.ttf?28302404&x61486') format('truetype'), url('/content/themes/isicargo/fontello/font/fontello.svg?28302404#fontello&x61486') format('svg'); font-weight: normal; font-style: normal; } /* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */ /* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */ /* @media screen and (-webkit-min-device-pixel-ratio:0) { @font-face { font-family: 'fontello'; src: url('/content/themes/isicargo/fontello/font/fontello.svg?28302404#fontello&x61486') format('svg'); } } */ [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "fontello"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center; /* opacity: .8; */ /* For safety - reset parent styles, that can break glyph codes*/ font-variant: normal; text-transform: none; /* fix buttons height, for twitter bootstrap */ line-height: 1em; /* Animation center compensation - margins should be symmetric */ /* remove if not needed */ margin-left: .2em; /* you can be more comfortable with increased icons size */ /* font-size: 120%; */ /* Font smoothing. That was taken from TWBS */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* Uncomment for 3D effect */ /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */ } .icon-wp-edit:before { content: '\e811'; } /* '' */ @font-face { font-family:"Regular"; src:url("/content/themes/isicargo/webfonts/regular.woff2") format("woff2"),url("/content/themes/isicargo/webfonts/regular.woff?x61486") format("woff"); font-style:normal;font-weight:400; font-display: swap; } @font-face { font-family:"Italic"; src:url("/content/themes/isicargo/webfonts/italic.woff2") format("woff2"),url("/content/themes/isicargo/webfonts/italic.woff?x61486") format("woff"); font-style:normal;font-weight:400; font-display: swap; } @font-face { font-family:"Demi"; src:url("/content/themes/isicargo/webfonts/demi.woff2") format("woff2"),url("/content/themes/isicargo/webfonts/demi.woff?x61486") format("woff"); font-style:normal;font-weight:400; font-display: swap; } @font-face { font-family:"Bold"; src:url("/content/themes/isicargo/webfonts/bold.woff2") format("woff2"),url("/content/themes/isicargo/webfonts/bold.woff?x61486") format("woff"); font-style:normal;font-weight:400; font-display: swap; } /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ /** * 1. Change the default font family in all browsers (opinionated). * 2. Correct the line height in all browsers. * 3. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ /* Document ========================================================================== */ html { font-family: sans-serif; /* 1 */ line-height: 1.15; /* 2 */ -ms-text-size-adjust: 100%; /* 3 */ -webkit-text-size-adjust: 100%; /* 3 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ body { margin: 0; } /** * Add the correct display in IE 9-. */ article, aside, footer, header, nav, section { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * Add the correct display in IE 9-. * 1. Add the correct display in IE. */ figcaption, figure, main { /* 1 */ display: block; } /** * Add the correct margin in IE 8. */ figure { margin: 1em 40px; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * 1. Remove the gray background on active links in IE 10. * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ } a, button { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /** * Remove the outline on focused links when they are also active or hovered * in all browsers (opinionated). */ a:active, a:hover { outline-width: 0; } /** * 1. Remove the bottom border in Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { font-weight: inherit; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font style in Android 4.3-. */ dfn { font-style: italic; } /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; color: #000; } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; height: 0; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } /** * Hide the overflow in IE. */ svg:not(:root) { overflow: hidden; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers (opinionated). * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Change the border, margin, and padding in all browsers (opinionated). */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * 1. Add the correct display in IE 9-. * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Remove the default vertical scrollbar in IE. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10-. * 2. Remove the padding in IE 10-. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in IE 9-. * 1. Add the correct display in Edge, IE, and Firefox. */ details, /* 1 */ menu { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Scripting ========================================================================== */ /** * Add the correct display in IE 9-. */ canvas { display: inline-block; } /** * Add the correct display in IE. */ template { display: none; } /* Hidden ========================================================================== */ /** * Add the correct display in IE 10-. */ [hidden] { display: none; } html, button, input, select, textarea { color: #222; } body { font-size: 1em; line-height: 1.4; } ::-moz-selection { background: #000; color: #fff; text-shadow: none; } ::selection { background: #000; color: #fff; text-shadow: none; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } img { vertical-align: middle; } fieldset, iframe, figure, blockquote { border: 0; margin: 0; padding: 0; } textarea { resize: vertical; } .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } ul, ol, h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; list-style: none; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: normal; } a { text-decoration: none; color: inherit; } [class^="icon-"]:before, [class*=" icon-"]:before { width: auto; margin-right: 0; margin-left: 0; } select::-ms-expand { display: none; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-slide { outline: 0; } .btn-wp-edit { display: block; float: left; position: fixed; bottom: 1rem; left: 1rem; z-index: 10000; color: #fff; background: #222; min-width: 1.875rem; height: 1.875rem; line-height: 1.875rem; text-align: center; border-radius: .9375rem; white-space: nowrap; font-family: Arial; text-transform: uppercase; } .btn-wp-edit i { position: absolute; top: 0; left: 0.55rem; } .btn-wp-edit > span { display: inline-block; position: relative; overflow: hidden; max-width: 0; -webkit-transition: max-width 150ms; -moz-transition: max-width 150ms; -ms-transition: max-width 150ms; -o-transition: max-width 150ms; transition: max-width 150ms; margin-left: 1.875rem; } .btn-wp-edit:hover > span { max-width: 12.5rem; } .btn-wp-edit > span > span { display: inline-block; padding-right: 0.55rem; font-size: .75rem; } .btn-wp-edit { font-size: 16px; bottom: 0; left: 0; min-width: 2.275em; height: 2.275em; line-height: 2.275em; border-radius: 0; } .btn-wp-edit i { left: 0.65em; } .btn-wp-edit > span { margin-left: 2.275em; } .btn-wp-edit > span > span { font-size: .75em; padding-right: .65em; } .btn-wp-edit:hover > span { max-width: 12.5em; } .sn-col-set { letter-spacing:-.31em; *letter-spacing:normal; *word-spacing:-.43em; text-rendering:optimizespeed; display:-webkit-flex; display: flex; -webkit-flex-flow:row wrap; display:-ms-flexbox; -ms-flex-flow:row wrap; flex-flow: row wrap; -ms-align-content:flex-start; -webkit-align-content:flex-start; align-content:flex-start; } .sn-col-set-nowrap { -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .sn-col-set > * { display:inline-block; *display:inline; zoom:1; letter-spacing:normal; word-spacing:normal; vertical-align:top; text-rendering:auto; -moz-box-sizing: border-box; box-sizing: border-box; background-clip: padding-box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .sn-col-set-1 > * { width: 100%; margin-right: 0; } .sn-col-set-2 > * { width: 50%; } .sn-col-set-3 > * { width: 33.33333333333333333333%; } .sn-col-set-4 > * { width: 25%; } .sn-col-set-5 > * { width: 20%; } .sn-col-set-6 > * { width: 16.66666666666666666666%; } .sn-col-set > .sn-col-auto, .sn-col-set-footer > * { -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; } html:not(.explorer) .sn-col-set .sn-col-equal-height { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .sn-col-set .sn-col-space-between { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .sn-col-set .sn-col-valigned { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .pull-left { float: left; } .pull-right { float: right; } .btn { border: 0; border-radius: 0; display: inline-block; white-space: nowrap; font-size: 1rem; background: transparent; position: relative; } button.btn { -webkit-appearance: none; appearance: none; } .btn-set { margin-top: 1.2em; } span.loading { height: 0; width: 0; display: inline-block; vertical-align: bottom; position: relative; transition: all 150ms; transform: scale(0); } span.loading img { width: 100%; padding: 0.75rem; position: absolute; top: -0.9rem; left: 0; animation: spin .4s infinite linear; } span.loading.now { height: 1.3rem; width: 1.3rem; transform: scale(1); } img.ajax-loader { display: none !important; } button.btn { -webkit-appearance: none; appearance: none; outline: 0; box-shadow: none; } .lnk { display: inline-block; transition: opacity 250ms; } .btn:hover, .lnk:hover, a:hover span.btn { } .btn span.icon { margin: 0 .875rem; } .btn span.icon, .btn span.label, .lnk span.icon, .lnk span.label { display: inline-block; line-height: 1.4; vertical-align: top; white-space: normal; } .lnk span.icon { margin: 0 .875em; } .btn span.icon:last-child, .lnk span.icon:last-child { margin-right: 0; } .btn span.icon:first-child, .lnk span.icon:first-child { margin-left: 0; } .spanned > span { display: block; } .figure-cover { background-size: cover; background-position: center center; background-repeat: no-repeat; } .figure-contain { background-size: contain; background-position: center center; background-repeat: no-repeat; } .figure-cover img, .figure-contain img { display: none; } img.rounded { display: inline-block; border-radius: 50%; } .to-be-added { transform: translateY(60px); opacity: 0; transition: transform 1.2s, opacity 1.2s; transition-timing-function: cubic-bezier(0.19,1,.22,1); } .just-added { transform: translateY(0px); opacity: 1; } button.link { all: inherit; cursor: pointer; } address { font-style: normal; } a { text-decoration-skip: ink; } :focus:not(:focus-visible) { outline: none } html { overflow-y: scroll; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .wysiwyg a { word-wrap: break-word; } /* DEV */ #breakpoints { position: fixed; bottom: 0; right: 0; background: #000; padding: 0.5em .75em; font-size: 16px; color: #fff; z-index: 20000; } #breakpoints::after { content: 'max'; } /* ROOT */ :root { --base-font-1-regular: "Regular", sans-serif; --base-font-1-italic: "Italic", sans-serif; --base-font-1-demi: "Demi", sans-serif; --base-font-1-bold: "Bold", sans-serif; --px: min(1px, calc((100 / 1440) * 1vw)); --px-infinite: calc((100 / 1440) * 1vw); --px-mobile: calc((100 / 375) * 1vw); --base-unit: var(--px); --ttf: cubic-bezier(0.19, 1, 0.22, 1); --ttf-2: cubic-bezier(0.075, 0.820, 0.165, 1); --ttf-3: cubic-bezier(0.64, 0, 0.78, 0); --ttf-4: cubic-bezier(0.8, 0, 0.2, 1); --ttf-5: cubic-bezier(0.165, 0.84, 0.4, 1); --ttf-6: cubic-bezier(0.6, 0.07, 0.17, 1); --ttf-7: cubic-bezier(0.247, 0.75, 0.187, 1); --ttf-8: cubic-bezier(1, 0, 0, 1); --page-padding-top: 0; --page-padding-left: max(20px, calc(32 * var(--px))); --page-padding-right: var(--page-padding-left); --page-padding-left-l: max(20px, calc(64 * var(--px))); --page-padding-right-l: var(--page-padding-left-l); --base-color-black: #11110e; --base-color-off-black: #171715; --base-color-white: #fff; --base-color-off-white: #f4f4f4; --base-color-yellow: #ffee02; --base-color-purple: #ff41b4; --base-color-light-purple: #ffdbf1; --base-color-dark-purple: #bf3187; --base-color-blue: #45bcff; --base-color-green: #0ada82; --base-color-gray: #b0afc4; --base-color-light-gray: #f0f0f4; --base-color-lightest-gray: #f8f8fa; --base-color-dark-gray: #686868; --base-color-darkest-gray: #343434; --base-color-red: #ef6267; } /* BASE */ html { scroll-behavior: smooth; } html.is-transitioning, html.is-forced-scrolling { scroll-behavior: auto; } body { font-size: 100%; font-family: var(--base-font-1-regular); font-weight: 400; color: var(--base-color-black); line-height: 1.3; background: var(--base-color-white); } body.view-b2b { color: var(--base-color-off-white); background: var(--base-color-off-black); } input, textarea, select, button { font-family: var(--base-font-1-regular); font-weight: 400; color: inherit; } img { max-width: 100%; height: auto; } *:not(.has-component-inner) .module-inner, header.main > .inner, .cookie-bar > .inner, *.has-component-inner .component-inner { position: relative; margin: 0 auto; padding-left: var(--page-padding-left); padding-right: var(--page-padding-right); box-sizing: border-box; } .module-full-width .module-inner { max-width: none; padding-left: 0; padding-right: 0; } .load-more { text-align: center; } .wysiwyg a { text-decoration: underline; } @media (hover: hover) { .wysiwyg a:is(:hover, :focus) { text-decoration: none; } } .wysiwyg > *:not(:last-child) { margin-bottom: .75em; } .wysiwyg strong { font-weight: normal; font-family: var(--base-font-1-demi); } .wysiwyg > ul:not(.plain), .wysiwyg > ol:not(.plain) { counter-reset: supernovae; } .wysiwyg > ul:not(.plain) li, .wysiwyg > ol:not(.plain) li { position: relative; padding-left: 1.5em; } .wysiwyg > ul:not(.plain) li:not(:last-child), .wysiwyg > ol:not(.plain) li:not(:last-child) { } .wysiwyg > ul:not(.plain) li::before { content: '—'; position: absolute; left: 0; } .wysiwyg > ol:not(.plain) li::before { content: counter(supernovae) '.'; counter-increment: supernovae; position: absolute; left: 0; } .wysiwyg > ul ul li::before { } .wysiwyg > ul ul, .wysiwyg > ol ol { } .wysiwyg table { width: auto !important; } .wysiwyg table td { width: auto !important; height: auto !important; } @keyframes spin { from {transform:rotate(0deg);} to {transform:rotate(360deg);} } span.loading img { top: -12px; } span.loading { vertical-align: middle; } .btn-menu { appearance: none; -webkit-appearance: none; -moz-appearance: none; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: pointer; color: inherit; } *[class*="hdln-"] { font-family: var(--base-font-1-demi); font-size: max(var(--min-font-size, 1rem), min(var(--this-font-size), var(--max-font-size, var(--this-font-size)))); --this-font-size: calc(var(--font-size) * (100 / var(--scale-breakpoint)) * 1vw); --scale-breakpoint: 1440; } *[class*="hdln-"][class*="hdln-b"] { font-family: var(--base-font-1-bold); } .hdln-72 { --font-size: 72; --min-font-size: 2.25rem; --max-font-size: 4.5rem; line-height: 1.05; letter-spacing: 0.013em; } @media (max-width: 500px) { .hdln-72 { hyphens: auto; hyphenate-limit-chars: 7; } } .hdln-64 { --font-size: 64; --min-font-size: 1rem; --max-font-size: 4rem; line-height: 0.95; letter-spacing: 0.013em; } .hdln-52 { --font-size: 52; --min-font-size: 2.25rem; --max-font-size: 3.25rem; line-height: 1.05; letter-spacing: 0.013em; } @media (max-width: 500px) { .hdln-52 { hyphens: auto; hyphenate-limit-chars: 7; } } .hdln-36 { --font-size: 36; --min-font-size: 1.5rem; --max-font-size: 2.25rem; line-height: 1.05; letter-spacing: 0.013em; } .hdln-24 { --font-size: 24; --min-font-size: 1.25rem; --max-font-size: 1.5rem; line-height: 1.15; letter-spacing: 0.013em; } .hdln-20 { --font-size: 20; --min-font-size: 1rem; --max-font-size: 1.25rem; line-height: 1.15; } .hdln-18 { --font-size: 18; --min-font-size: 1rem; --max-font-size: 1.125rem; line-height: 1.05; } *[class*="cpy-"], .image-caption, .form-list > li.input input, .form-list > li.input textarea, .form-list > li.select select { font-family: var(--base-font-1-regular); font-size: max(var(--min-font-size, 1rem), min(var(--this-font-size), var(--max-font-size, var(--this-font-size)))); --this-font-size: calc(var(--font-size) * (100 / var(--scale-breakpoint)) * 1vw); --scale-breakpoint: 1440; } *[class*="cpy-"][class*="cpy-b"] { font-family: var(--base-font-1-bold); } *[class*="cpy-"][class*="cpy-d"] { font-family: var(--base-font-1-demi); } .cpy-42 { --font-size: 42; --min-font-size: 1.375rem; --max-font-size: 2.625rem; line-height: 1.25; letter-spacing: 0.013em; } .cpy-32 { --font-size: 32; --min-font-size: 1.25rem; --max-font-size: 2rem; line-height: 1.45; letter-spacing: 0.013em; } .cpy-26 { --font-size: 26; --min-font-size: 1.125rem; --max-font-size: 1.625rem; line-height: 1.45; letter-spacing: 0.013em; } .cpy-22 { --font-size: 22; --min-font-size: 1.125rem; --max-font-size: 1.375rem; line-height: 1.35; letter-spacing: 0.013em; } .cpy-20, .form-list > li.input input, .form-list > li.input textarea, .form-list > li.select select { --font-size: 20; --min-font-size: .9375rem; --max-font-size: 1.25rem; line-height: 1.25; letter-spacing: 0.013em; } .form-list > li.input input, .form-list > li.input textarea, .form-list > li.select select { --min-font-size: 1.125rem; } .cpy-18 { --font-size: 18; --min-font-size: .875rem; --max-font-size: 1.125rem; line-height: 1.27777777777777777777; letter-spacing: 0.013em; } .cpy-17 { --font-size: 17; --min-font-size: .875rem; --max-font-size: 1.0625rem; line-height: 1.27777777777777777777; letter-spacing: 0.03em; } .cpy-16 { --font-size: 16; --min-font-size: .75rem; --max-font-size: 1rem; line-height: 1.25; letter-spacing: 0.03em; } .cpy-14 { --font-size: 14; --min-font-size: .875rem; --max-font-size: .875rem; line-height: 1.3; letter-spacing: 0.05em; } .cpy-13 { --font-size: 13; --min-font-size: .8125rem; --max-font-size: .8125rem; line-height: 1.3; letter-spacing: 0.05em; } .cpy-12 { --font-size: 12; --min-font-size: .75rem; --max-font-size: .75rem; line-height: 1.25; letter-spacing: 0.05em; } .cpy-10 { --font-size: 10; --min-font-size: .625rem; --max-font-size: .625rem; line-height: 1.3; letter-spacing: 0.05em; } /* PAGE TRANSITIONS */ .transitioner { position: fixed; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; z-index: 998; } .transitioner::before { content: ''; position: absolute; display: block; top: 0; left: 0; right: 0; bottom: 0; background: var(--base-color-yellow); opacity: 0; z-index: 1; will-change: transform; } .barba-outer, .sn-pt-leave-active, .sn-pt-enter-active { transition: opacity; transition-duration: 1.2s; opacity: 1; } .sn-pt-leave-active .module:not(.module-model-overview), .sn-pt-enter-active .module:not(.module-model-overview), .barba-once-active .module:not(.module-model-overview) { transition: opacity 1s, transform 1s; transition-timing-function: cubic-bezier(0.19,1,.22,1); } .sn-pt-leave-active .transitioner::before, .sn-pt-enter-active .transitioner::before, .barba-once-active .transition::before { transition: opacity .75s; transition-timing-function: cubic-bezier(0.19,1,.22,1); } .sn-pt-enter-active .transitioner::before { transition-delay: .15s; } /* Starting state for leave */ .sn-pt-leave .module:not(.module-model-overview) { opacity: 1; } .sn-pt-leave .transitioner::before { opacity: 0; } /* Ending state for leave */ .sn-pt-leave-to .module:not(.module-model-overview) { opacity: 1; } .sn-pt-leave-to .transitioner::before { opacity: 1; } /* Starting state for enter */ .sn-pt-enter .module:not(.module-model-overview), .barba-once .module:not(.module-model-overview) { /*opacity: 0;*/ transform: translateY(80px); } .sn-pt-enter .transitioner::before, .barba-once .transitioner::before { opacity: 1; } /* Ending state for enter */ .sn-pt-enter-to .module:not(.module-model-overview), .barba-once-to .module:not(.module-model-overview) { opacity: 1; transform: none; } .sn-pt-enter-to .transitioner::before, .barba-once-to .transitioner::before { opacity: 0; } /* ON SCREEN */ /* clip left to right */ *[data-ios] *[data-ios-item="a"] { opacity: 0; -webkit-clip-path: inset(0% 100% 0% 0%); clip-path: inset(0% 100% 0% 0%); transition: clip-path 1.5s, -webkit-clip-path 1.5s, opacity 1.5s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-item-index) * 100ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="a"] { opacity: 1; -webkit-clip-path: inset(0% 0% 0% 0%); clip-path: inset(0% 0% 0% 0%); } /* clip top to bottom */ *[data-ios] *[data-ios-item="b"] { opacity: 0; -webkit-clip-path: inset(0% 0% 100% 0%); clip-path: inset(0% 0% 100% 0%); transition: clip-path 1.5s, -webkit-clip-path 1.5s, opacity 1.5s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-item-index) * 100ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="b"] { opacity: 1; -webkit-clip-path: inset(0% 0% 0% 0%); clip-path: inset(0% 0% 0% 0%); } /* pop randomly */ *[data-ios] *[data-ios-item="c"] { transform: scale(0.8); opacity: 0; transition: transform 1s, opacity 1s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-random) * 30ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="c"] { opacity: 1; transform: none; } /* clip vertically from center */ *[data-ios] *[data-ios-item="d"] { opacity: 0; -webkit-clip-path: inset(50% 0% 50% 0%); clip-path: inset(50% 0% 50% 0%); transition: clip-path 1.5s, -webkit-clip-path 1.5s, opacity 1.5s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-item-index) * 100ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="d"] { opacity: 1; -webkit-clip-path: inset(0% 0% 0% 0%); clip-path: inset(0% 0% 0% 0%); } /* move in from bottom */ *[data-ios] *[data-ios-item="e"] { opacity: 0; transform: translateY(2vw); transition: opacity 1.5s, transform 1.5s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-item-index) * 100ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="e"] { opacity: 1; transform: none; } /* move in from right */ *[data-ios] *[data-ios-item="f"] { opacity: 0; transform: translateX(20vw); transition: opacity 1.5s, transform 1.5s; transition-timing-function: cubic-bezier(.075, .82, .165, 1); transition-delay: calc((var(--ios-item-index) * 100ms) + var(--ios-delay, 0ms)); will-change: opacity; } *[data-ios].is-on-screen *[data-ios-item="f"] { opacity: 1; transform: none; } button, .btn, .lnk { font-family: var(--base-font-1-demi); font-size: max(var(--min-font-size, 1rem), min(var(--this-font-size), var(--max-font-size, var(--this-font-size)))); --this-font-size: calc(var(--font-size) * (100 / var(--scale-breakpoint)) * 1vw); --scale-breakpoint: 1440; margin: 0; border: 0; padding: 0; border-radius: 0; box-shadow: none; background: transparent; display: inline-block; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; } .btn span.label, .lnk span.label { line-height: inherit; } .btn-a { --font-size: 22; --min-font-size: 1rem; --max-font-size: 1.375rem; text-transform: uppercase; color: var(--color, var(--base-color-white)); background: var(--background-color, var(--base-color-purple)); padding: .36363636363636363636em; line-height: .81818181818181818181; letter-spacing: 0.03em; box-sizing: border-box; } body.view-b2b .btn-a { color: var(--color, var(--base-color-black)); background: var(--background-color, var(--base-color-green)); } .btn-a.green { color: var(--base-color-black); background: var(--base-color-green); } body.view-b2b .btn-a.purple, .btn-a.purple { color: var(--base-color-white); background: var(--base-color-purple); } .btn-a.small { --font-size: 18; --min-font-size: 1rem; --max-font-size: 1.125rem; padding: .55555555555555555555em; } .btn-a.full-width { width: 100%; } .lnk-a { font-family: var(--base-font-1-regular); --font-size: 14; --min-font-size: .875rem; --max-font-size: .875rem; } .lnk-b, .lnk-c { font-family: var(--base-font-1-regular); --font-size: 16; --min-font-size: 1rem; --max-font-size: 1rem; } .lnk-b { line-height: 1.4; } .lnk-c { font-family: var(--base-font-1-demi); --font-size: 22; --min-font-size: 1rem; --max-font-size: 1.375rem; letter-spacing: 0.03em; line-height: 1.27272727272727272727; text-transform: uppercase; color: var(--base-color-purple); } body.view-b2b .lnk-c { color: var(--base-color-yellow); } .module[data-background-color="purple"] .lnk-c { color: var(--base-color-white); } .btn-a span.wrap, .lnk-b span.wrap, .lnk-c span.wrap { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; } .btn-a[data-icon-position="right"] span.icon, .lnk-b[data-icon-position="right"] span.icon, .lnk-c[data-icon-position="right"] span.icon { margin: 0 0 0 .5em; } .btn-a svg, .lnk-b svg, .lnk-c svg { display: block; height: auto; width: max(var(--icon-width-px), calc(var(--icon-width) * var(--px))); } .btn-a[data-icon="arrow-right-bold"] svg, .lnk-c[data-icon="arrow-right-bold"] svg { width: max(19px, calc(19 * var(--px))); } .btn-a[data-icon="arrow-right-bold"][target="_blank"] svg, .lnk-c[data-icon="arrow-right-bold"][target="_blank"] svg { transform: rotate(-45deg); } .btn-a svg path, .lnk-b svg path, .lnk-c svg path { fill: currentColor; } /* FORMS */ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus { -webkit-text-fill-color: var(--color); -webkit-box-shadow: 0 0 0px 1000px #fff inset; transition: background-color 5000s ease-in-out 0s; } ::-webkit-input-placeholder { color: var(--color); } ::placeholder { color: var(--color); } .styled-select, .styled-search { position: relative; } .styled-select select, li.search input { -webkit-appearance: none; -moz-appearance: none; appearance: none; } .styled-select select { cursor: pointer; } .styled-select::after, .styled-search::after { font-family: "fontello"; content: '\e800'; position: absolute; right: 1rem; top: calc(50% - 2px); z-index: 2; pointer-events: none; color: #fff; transform: translateY(-50%); } .styled-search::after { content: '\e80f'; font-size: 140%; top: 50%; } .styled-checkbox { position: relative; } .styled-checkbox input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; display: block; -webkit-appearance: none; -moz-appearance: none; appearance: none; opacity: 0; } .styled-checkbox label { display: block; } .styled-checkbox .label { display: inline-block; white-space: nowrap; background: var(--base-color-light-gray); line-height: 1.27777777777777777777; border-radius: 1px; padding: 4px 8px; font-size: max(14px, calc(18 * var(--px))); color: #828282; cursor: pointer; user-select: none; transition: 500ms var(--ttf-2); transition-property: background-color, color; } .styled-checkbox input:checked + .label { color: var(--base-color-white); background: var(--base-color-purple); } body.view-b2b .styled-checkbox input:checked + .label { background: var(--base-color-green); } .screen-reader-response, .response-wrapper.top { display: none; } .wpcf7-response-output { padding-top: 2em; } .wpcf7-form.sent .wpcf7-response-output { display: none !important; } .success-copy { display: none; } .wpcf7-not-valid-tip { position: absolute; top: 0; right: 0; color: var(--base-color-dark-purple); display: block; font-size: .875rem; font-family: var(--base-font-1-demi); text-transform: uppercase; } .form-list { display: flex; flex-flow: row wrap; --gap: max(24px, calc(32 * var(--px))); margin-bottom: calc(var(--gap) * -1); } .form-list--model-inquiry { --gap: 12px; } .form-list > li { width: 100%; margin-bottom: var(--gap); position: relative; } .form-list > li.li-50 { width: calc(50% - (var(--gap) / 2)); } @media (max-width: 600px) { .form-list > li.li-50 { width: 100%; } } .form-list > li.li-last { margin-left: auto; } .form-list label.cpy-14, .form-list label.cpy-12 { display: block; margin-bottom: 4px; color: var(--base-color-dark-gray); } .form-list--model-inquiry label.cpy-12 { color: var(--base-color-dark-purple); } .form-list label .required { padding-left: 0.25em; } .form-list > li.gdpr .sn-col-set { display: flex; flex-flow: row nowrap; } .form-list > li.gdpr .sn-col-set > div:first-child { margin-right: max(12px, calc(24 * var(--px))); flex-shrink: 0; } .form-list--model-inquiry > li.gdpr .sn-col-set > div:first-child { margin-right: 12px; } .form-list > li.gdpr .sn-col-set > div:last-child { width: 100%; } .form-list > li.gdpr input { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: var(--base-color-white); --size: max(24px, calc(34 * var(--px))); width: var(--size); height: var(--size); border: 0; box-shadow: none; padding: 0; border-radius: 0; cursor: pointer; box-shadow: 0 0 0 var(--size) inset var(--base-color-white); transition: 150ms var(--ttf-2); transition-property: box-shadow, background; } .form-list > li.gdpr input:checked { box-shadow: 0 0 0 calc(var(--size) * 0.2) inset var(--base-color-white); background: var(--base-color-purple); } .form-list > li.input input, .form-list > li.input textarea, .form-list > li.select select { border: 0; padding: .58em .5em; margin: 0; display: block; box-sizing: border-box; border-radius: 0; background: var(--base-color-white); width: 100%; } .form-list > li.select select { cursor: pointer; } .form-list > li.input.error input, .form-list > li.input.error textarea, .form-list > li.select.error select { outline: 2px solid var(--base-color-dark-purple); } .form-list button[type="submit"] { display: inline-flex; flex-flow: row nowrap; } .form-list--model-inquiry > li.submit { border-top: 1px solid var(--base-color-dark-purple); padding-top: var(--gap); } .form-list--model-inquiry > li.submit > div { display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; } .form-list--model-inquiry > li.submit .btn-cancel-model-inquiry { color: var(--base-color-dark-purple); } span.loading img { padding: 0; top: auto; } span.loading { margin-left: 0; } span.loading.now { height: .75em; width: .75em; margin-left: 0.5em; } :root { --header-height: max(70px, calc(70 * var(--px))); } header.main { position: sticky; top: 0; left: 0; width: 100%; height: var(--header-height); z-index: 100; background: var(--base-color-yellow); transition: transform 500ms var(--ttf-4); } body.view-b2b header.main { background: var(--base-color-green); color: var(--base-color-black); } header.main > .inner > .wrap { position: relative; height: var(--header-height); } @media (min-width: 601px) { body.scrolled-more:not([data-scroll-dir="up"]):not(.menu) header.main { transform: translateY(-100%); } } nav.header { text-transform: uppercase; position: absolute; left: 0; top: 0; width: 100%; text-align: center; z-index: 1; } nav.header .menu { display: inline-flex; flex-flow: row nowrap; height: var(--header-height); align-items: center; } nav.header .menu > li + li { margin-left: calc(24 * var(--px)); } nav.header .current-menu-any > a { text-decoration: underline; text-decoration-thickness: .11764705882352941176em; text-underline-offset: .23529411764705882352em; } nav .btn-appointment { color: var(--base-color-purple); } body.view-b2b nav .btn-appointment { color: var(--base-color-white); } nav.header .btn-en a, .language-button-wrap .btn-en a { display: inline-block; position: relative; text-decoration: none !important; } nav.header .btn-en a::before { content: ''; display: block; position: absolute; inset: -0.3em -0.5em; border: 1px solid var(--base-color-black); opacity: 0.5; } .language-button-wrap { display: none; } @media (max-width: 1000px) { nav.header { display: none; } .language-button-wrap { display: block; position: absolute; right: 49px; top: 50%; z-index: 5; transform: translateY(-50%); --min-font-size: 1.125rem; } } nav.header--v2 { text-transform: uppercase; position: absolute; top: 50%; transform: translateY(-50%); left: calc(max(112px, calc(146 * var(--px))) + 25px); z-index: 1; } nav.header--v2 .menu { display: inline-flex; flex-flow: row nowrap; align-items: flex-start; gap: 0 5px; } nav.header--v2 .menu > li > a { display: block; padding: .76470588235294117647em 1.11764705882352941176em; transition: 250ms var(--ttf-2); transition-property: background, color; } nav.header--v2 .menu > li > a svg path { fill: currentColor; transition: fill 250m var(--ttf-2); } nav.header--v2 .menu > li.current-menu-any > a, nav.header--v2 .menu > li:is(:focus, :hover, :focus-within) > a { color: var(--base-color-white); background: var(--base-color-black); } nav.header--v2 .menu > li:is(:focus, :hover, :focus-within) + li:not(.btn-appointment) > a { background: transparent; color: var(--base-color-black); } nav.header--v2 .menu > li > a > span { display: flex; flex-flow: row nowrap; align-items: center; gap: 0 0.2em; } nav.header--v2 .menu span[aria-hidden], nav.header--v2 .menu span[aria-hidden] * { display: block; } nav.header--v2 li.has-sub-menu { position: relative; } nav.header--v2 .sub-menu-wrapper.depth-1 { position: absolute; top: calc(100% - 1px); left: 0; opacity: 0; pointer-events: none; background: var(--base-color-black); color: var(--base-color-white); padding: .76470588235294117647em 1.11764705882352941176em 1.5em; min-width: calc(100% + 2em); transition: 250ms var(--ttf-2); transition-property: transform, opacity; transform: scaleY(0.95); transform-origin: left top; will-change: transform; } nav.header--v2 li.has-sub-menu:is(:focus, :hover, :focus-within) .sub-menu-wrapper.depth-1 { opacity: 1; pointer-events: all; transform: none; } nav.header--v2 .sub-menu-wrapper.depth-1 .sub-menu { display: flex; flex-flow: column nowrap; gap: 0.5em 0; } @media (max-width: 1000px) { nav.header--v2 li:is(.btn-languages, .btn-appointment) { display: none; } } @media (max-width: 750px) { nav.header--v2 li { display: none; } nav.header--v2 li.btn-appointment { display: block; } } @media (max-width: 500px) { nav.header--v2 li.btn-appointment { display: none; } } .btn-menu { position: absolute; right: 0; top: 50%; width: 30px; height: 30px; z-index: 5; transform: translateY(-50%); display: none; } .btn-menu .bar { display: block; width: 100%; height: 3px; background: var(--base-color-black); position: absolute; left: 0; transform-origin: center center; transition: 500ms var(--ttf-2); transition-property: top, transform, opacity; } .btn-menu .bar-1 { top: 6px; } .btn-menu .bar-2 { top: 13px; } .btn-menu .bar-3 { top: 20px; } @media (max-width: 1000px) { .btn-menu { display: block; } body.menu .btn-menu .bar-1 { top: calc(50% - 2px); transform: rotate(45deg); } body.menu .btn-menu .bar-2 { opacity: 0; } body.menu .btn-menu .bar-3 { top: calc(50% - 2px); transform: rotate(-45deg); } } .site-title--header { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 2; } .site-title--header img { width: max(112px, calc(146 * var(--px))); } .b2x-button-wrap { position: absolute; top: 0; right: 0; z-index: 2; } .btn-b2x { display: block; text-align: center; color: var(--base-color-green); padding: 0.42em 2.4em 1.4em; position: relative; clip-path: polygon(0% 0%, 0% 0%, 50% 100%, 100% 0%); } .btn-b2x::after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--base-color-black); z-index: -1; } body.view-b2b .btn-b2x { color: var(--base-color-off-white); } body.view-b2b .btn-b2x::after { background: var(--base-color-purple); } @media (max-width: 1000px) { .b2x-button-wrap { right: auto; left: 50%; transform: translateX(-50%); } .btn-b2x { clip-path: polygon(0% 0%, 0% 0%, 50% 80%, 100% 0%); } } div.flyout .cpy-42 { --min-font-size: 1.5rem; } div.flyout { position: fixed; top: var(--header-height, 0px); left: 0; bottom: 0; right: 0; z-index: 99; overflow: auto; pointer-events: none; visibility: hidden; opacity: 0; transition: visibility 0s .5s, opacity .5s 0s; transition-timing-function: var(--ttf-2); color: var(--base-color-black); } @media (min-width: 1001px) { div.flyout { display: none; } } body.menu div.flyout { pointer-events: all; visibility: visible; transition-delay: 0s, 0s; transition-duration: 0s, 0s; opacity: 1; } div.flyout::before { content: ''; display: block; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: var(--base-color-yellow); z-index: 1; transform: scaleX(0); transform-origin: left center; transition: 1s 0s var(--ttf-2); transition-property: transform; } body.view-b2b div.flyout::before { background: var(--base-color-green); } body.menu div.flyout::before { transform: none; } div.flyout > .inner { position: relative; z-index: 2; padding-bottom: calc(var(--page-padding-left) * 2.5); } div.flyout > .inner > div { position: relative; padding: calc(var(--page-padding-left) * 1.5) var(--page-padding-left); text-transform: uppercase; } div.flyout > .inner > div::before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: var(--base-color-black); opacity: 0; transform: scaleX(0); transform-origin: left center; transition: 0s .2s var(--ttf-2); transition-property: transform, opacity; } body.menu div.flyout > .inner > div::before { opacity: 1; transition-duration: 1s; transition-delay: calc(var(--delay, 0ms) + (50ms * var(--index, 0)) + 200ms); transform: none; } div.flyout > .inner > div.row-2 { --delay: 150ms; } div.flyout > .inner > div.row-3 { --delay: 300ms; } body.menu div.flyout > .inner > div { transform: none; opacity: 1; } div.flyout .menu > li + li { margin-top: 0.75em; } div.flyout .menu > li { opacity: 0; transition: 0s .2s var(--ttf-2); transition-property: transform, opacity; transform: translateX(-20px); } body.menu div.flyout .menu > li { transition-duration: 1s; transition-delay: calc(var(--delay, 0ms) + (50ms * var(--index, 0)) + 300ms); opacity: 1; transform: none; } div.flyout .b2x-switch { position: fixed; left: 0; width: 100%; bottom: 0; z-index: 2; } div.flyout .b2x-switch .btn { box-sizing: border-box; width: 100%; padding: calc(var(--page-padding-left) * 0.75) var(--page-padding-left); transform: translateY(100%); transition: transform 0s .2s var(--ttf-2); } body.view-b2b div.flyout .b2x-switch .btn { --background-color: var(--base-color-purple); } body.menu div.flyout .b2x-switch .btn { transform: none; transition-delay: .5s; transition-duration: 1s; } @media (max-width: 500px) { div.flyout .b2x-switch .btn span.wrap { justify-content: flex-start; } } nav.flyout-primary--v2 .menu > li > a { display: block; background: var(--base-color-black); color: var(--base-color-yellow); margin-inline: calc(var(--page-padding-left) * -1); padding-inline: var(--page-padding-left); padding-block: 0.5em; } body.view-b2b nav.flyout-primary--v2 .menu > li > a { color: var(--base-color-green); } nav.flyout-primary--v2 .menu > li > a > span { display: flex; flex-flow: row nowrap; gap: 0 1em; align-items: center; } nav.flyout-primary--v2 .menu > li > a span[aria-hidden] { margin-left: auto; } nav.flyout-primary--v2 .menu > li > a span[aria-hidden] * { display: block; } nav.flyout-primary--v2 svg { position: relative; transform: none; transition: transform 500ms var(--ttf-2); } nav.flyout-primary--v2 li.open svg { transform: rotate(-180deg); } nav.flyout-primary--v2 svg path { fill: currentColor; } nav.flyout-primary--v2 .menu > li .sub-menu-wrapper { display: grid; grid-template-rows: 0fr; overflow: hidden; pointer-events: none; opacity: 0; transition: 500ms var(--ttf-2); transition-property: grid-template-rows, opacity; } nav.flyout-primary--v2 .menu > li.open .sub-menu-wrapper { grid-template-rows: 1fr; pointer-events: all; opacity: 1; } nav.flyout-primary--v2 .menu > li .sub-menu-ul { overflow: hidden; } nav.flyout-primary--v2 .menu > li .sub-menu-wrapper .sub-menu { padding-top: .75em; } nav.flyout-primary--v2 .clearfix::before, nav.flyout-primary--v2 .clearfix::after { display: none; } footer.main { --offset-left: calc(624 * var(--px)); } footer.main > .inner { position: relative; } footer.main .row--address { background: var(--base-color-light-gray); --padding-y: max(32px, calc(57 * var(--px))); padding: var(--padding-y) calc(122 * var(--px)); padding-left: var(--offset-left); } body.view-b2b footer.main .row--address { background: var(--base-color-off-black); } footer.main .row--address .headline { text-transform: uppercase; margin-bottom: max(12px, .41666666666666666666em); } .hours-and-address { display: flex; flex-flow: row nowrap; gap: calc(52 * var(--px)); } .hours-list > li { display: flex; flex-flow: row nowrap; } .hours-list .label { display: block; min-width: 4.31818181818181818181em; } @media (max-width: 850px) { footer.main .row--address { padding-left: var(--page-padding-left); padding-right: var(--page-padding-left); } } @media (max-width: 700px) { .hours-and-address { flex-flow: column nowrap; gap: 12px; } } .footer-bike { position: absolute; top: 0; left: var(--page-padding-left-l); width: calc(var(--offset-left) * 0.717); pointer-events: none; z-index: 2; } @media (max-width: 850px) { .footer-bike { left: auto; right: var(--page-padding-right); } } @media (max-width: 700px) { .footer-bike { position: relative; top: auto; left: auto; right: auto; bottom: auto; width: 100%; } .footer-bike img { position: absolute; display: block; right: var(--page-padding-right); width: max(200px, 40vw); top: 0; transform: translateY(-60%); } } footer.main .row--teaser { background: var(--base-color-black); color: var(--base-color-white); --padding-y: calc(76 * var(--px)); padding: var(--padding-y) var(--page-padding-left-l); padding-left: var(--offset-left); } .footer-teaser { max-width: max(454px, calc(560 * var(--px))); } .footer-teaser .headline { margin-bottom: .66666666666666666666em; color: var(--base-color-green); text-transform: uppercase; } body.view-b2b .footer-teaser .headline { color: var(--base-color-purple); } .footer-teaser .btn-set { margin-top: max(24px, calc(24 * var(--px))); } @media (max-width: 850px) { footer.main .row--teaser { padding-left: var(--page-padding-left); padding-right: var(--page-padding-left); } } @media (max-width: 700px) { footer.main .row--teaser { padding-top: 70px; padding-bottom: 48px; } } footer.main .row--sitemap { background: var(--base-color-black); color: var(--base-color-white); --padding-y: max(48px, calc(64 * var(--px))); padding: var(--padding-y) var(--page-padding-left-l); padding-right: 0; position: relative; display: flex; flex-flow: row nowrap; justify-content: space-between; } footer.main .row--sitemap::before { content: ''; display: block; position: absolute; top: 0; left: var(--page-padding-left-l); right: var(--page-padding-left-l); height: 1px; background: #4e4e4e; } footer.main .footer-logo img { width: max(170px, calc(210 * var(--px))); } nav.footer .menu { display: flex; flex-flow: row nowrap; text-transform: uppercase; justify-content: space-between; } nav.footer .menu > li + li { margin-left: calc(120 * var(--px)); } nav.footer .menu > li > span { display: block; font-size: 1.41176470588235294117em; font-family: var(--base-font-1-demi); color: #4e4e4e; margin-bottom: max(16px, calc(32 * var(--px))); } nav.footer .sub-menu > li + li { margin-top: 1.2em; } nav.footer .sub-menu a { transition: color 250ms; } nav.footer .sub-menu > li.current-menu-any a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; color: var(--base-color-yellow); } @media (hover: hover) { nav.footer .sub-menu a:is(:hover, :focus) { color: var(--base-color-yellow); } } @media (max-width: 700px) { nav.footer { width: 100%; } nav.footer .menu { flex-flow: row wrap; } nav.footer .menu > li { width: 50%; } nav.footer .menu > li + li { margin-left: 0; } nav.footer .menu > li:nth-child(3) { margin-top: 48px; } .footer-logo { flex-shrink: 0; } } @media (max-width: 550px) { footer.main .row--sitemap { flex-flow: column nowrap; position: relative; padding-bottom: 100px; } footer.main .row--sitemap::before { left: 0; right: 0; } .footer-logo { position: absolute; right: 0; bottom: 40px; } footer.main .footer-logo img { width: 120px; } nav.footer .sub-menu > li + li { margin-top: 1em; } nav.footer .cpy-17 { font-size: 16px; } nav.footer .menu > li > span { font-size: 20px; } } footer.main .row--legal { background: var(--base-color-yellow); padding: 12px var(--page-padding-left); display: flex; flex-flow: row nowrap; } body.view-b2b footer.main .row--legal { color: var(--base-color-black); background: var(--base-color-green); } footer.main .row--legal .col-1 { display: flex; flex-flow: row nowrap; } nav.legal { margin-left: var(--page-padding-left); } nav.legal .menu { display: flex; flex-flow: row nowrap; } nav.legal .menu > li:not(:last-child)::after { content: '·'; display: inline-block; padding: 0 0.5em; } footer.main .row--legal .col-2 { margin-left: auto; } @media (max-width: 600px) { footer.main .row--legal { padding-top: 26px; padding-bottom: 34px; align-items: flex-start; } footer.main .row--legal .col-1 { flex-flow: column-reverse nowrap; } nav.legal { margin-left: 0; margin-bottom: 12px; } footer.main .row--legal .cpy-18 { font-size: 16px; } } @media (max-width: 500px) { nav.legal .menu { display: block; } nav.legal .menu > li:not(:last-child)::after { display: none; } }/* Theme Name: isicargo Author: SUPERNOVÆ Author URI: https://www.supernov.ae/ Version: 2023 */ @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { } /* ========================================================================== Helper classes ========================================================================== */ .ir { background-color: transparent; border: 0; overflow: hidden; *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 150%; } .hidden { display: none !important; visibility: hidden; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .invisible { visibility: hidden; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } /* ========================================================================== Print styles ========================================================================== */ @media print { * { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 1cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .cookie-bar, .btn-wp-edit { display: none !important; } header.main, footer.main { display: none; } } .card-background { position: absolute; inset: 0; z-index: 1; } .card-background .yellow, .card-background .purple { position: absolute; inset: 0; display: block; background: var(--base-color-purple); pointer-events: none; z-index: 1; transform-origin: left bottom; transition: 750ms var(--ttf-2); transition-property: background-color, transform; } body.view-b2b .card-background .purple { background: var(--base-color-green); } .card-background .purple > span { position: absolute; top: -3px; right: 5px; color: var(--base-color-white); line-height: 1; font-size: 40px; } .card-background .yellow { background: var(--base-color-lightest-gray); z-index: 2; } body.view-b2b .card-background .yellow { background: var(--base-color-white); } @media (hover: hover) { a:is(:hover, :focus) .card-background .yellow { background: var(--base-color-yellow); } a:is(:hover, :focus) .card-background .purple { transform: rotate(-3deg) translateY(-10px); } body.view-b2b a:is(:hover, :focus) .card-background .yellow { background: var(--base-color-white); } } /* CUSTOM POINTER */ *[data-custom-pointer] { cursor: none; } #pointer-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; pointer-events: none; --pointer-size: calc(120 * var(--base-unit)); } #pointer-overlay[data-pointer-type="close"] { --pointer-size: min(70px, calc(70 * var(--base-unit))); } #pointer-overlay svg { display: block; width: var(--pointer-size); height: var(--pointer-size); filter: drop-shadow(0 0 2px rgba(0,0,0,0.5)); } #pointer-overlay svg path { fill: var(--base-color-white); } #pointer-overlay > div { position: absolute; top: calc(var(--pointer-size) / -2); left: calc(var(--pointer-size) / -2); width: var(--pointer-size); height: var(--pointer-size); cursor: none; transform: translate(var(--pointer-left, 0px), var(--pointer-top, 0px)) rotate(var(--pointer-angle, 0deg)); transition: transform 75ms, opacity 250ms; } #pointer-overlay[data-pointer-type="close"] > div { transform: translate(var(--pointer-left, 0px), var(--pointer-top, 0px)); } #pointer-overlay > div > div { width: 100%; height: 100%; transition: transform 250ms, opacity 250ms; transition-timing-function: var(--ttf); opacity: 0; transform: scale(0.5); } #pointer-overlay > div > div > div { position: absolute; top: 0; left: 0; opacity: 0; transition: transform 150ms; } #pointer-overlay[data-pointer-type="arrow-left"] > div > div .arrow, #pointer-overlay[data-pointer-type="arrow-right"] > div > div .arrow { opacity: 1; } #pointer-overlay[data-pointer-type="arrow-left"] > div > div .arrow { transform: rotateY(-180deg); } #pointer-overlay[data-pointer-type="close"] > div > div .close { opacity: 1; } #pointer-overlay[data-state="on"] > div > div { opacity: 1; transform: none; } #intro { position: fixed; inset: 0; z-index: 1001; overflow: hidden; transition: visibility 0s 2s; display: none; } html[data-intro-shown="true"] #intro { display: block; } #intro .background-1 { background: var(--base-color-black); position: absolute; inset: 0; z-index: 3; transform-origin: center top; transition: transform 1000ms 0ms var(--ttf-5); } #intro .background-2 { background: var(--base-color-yellow); position: absolute; inset: 0; z-index: 2; transform-origin: center top; transition: transform 1000ms 250ms var(--ttf-5); } #intro .background-3 { background: var(--base-color-black); position: absolute; inset: 0; opacity: 0.5; z-index: 1; transition: opacity 1500ms 250ms var(--ttf-7); } #intro .inner { position: absolute; inset: 0; z-index: 4; display: flex; flex-flow: column nowrap; box-sizing: border-box; padding-top: calc(100 * var(--px)); } #intro .logo { margin-top: auto; align-self: center; margin-bottom: calc(17 * var(--px-infinite)); transform: translateY(30%); opacity: 0; transition: 1000ms 0ms var(--ttf-2); transition-property: transform, opacity; } #intro .logo svg { width: calc(336 * var(--px-infinite)); height: auto; display: block; transition: transform 2s var(--ttf-5); } #intro .shape { align-self: flex-end; transform: rotate(-10deg) translateY(25%) translateX(5%); transform-origin: right bottom; opacity: 0; transition: 1000ms 0ms var(--ttf-2); transition-property: transform, opacity; } #intro .shape svg { width: calc(888 * var(--px-infinite)); height: auto; display: block; } @media (max-width: 750px) { #intro .inner { justify-content: center; } #intro .logo { margin-top: 0; } } #intro.in .shape, #intro.in .logo { transform: none; opacity: 1; } #intro.in .logo svg { transform: translateY(-40%); } #intro.out { pointer-events: none; visibility: hidden; } #intro.out .background-1 { transform: scaleY(0); } #intro.out .background-2 { transform: scaleY(0); } #intro.out .background-3 { opacity: 0; } #intro.out .shape, #intro.out .logo { opacity: 0; transform: translateY(-100%); transition-timing-function: var(--ttf-5); } #intro.out .logo { transform: translateY(-300%); } #model-details-overlay { position: fixed; inset: 0; z-index: 1005; overflow: clip; color: var(--base-color-black); } #model-details-overlay .background { position: fixed; inset: 0; background: var(--base-color-yellow); z-index: 1; } #model-details-overlay > .inner { position: relative; z-index: 2; padding: var(--page-padding-left); padding-top: calc(52 * var(--px)); box-sizing: border-box; height: 100%; } #model-details-overlay > .inner > .wrap { position: relative; display: flex; flex-flow: column nowrap; height: 100%; } #model-details-overlay .brand { text-transform: uppercase; } .btn-close-overlay { display: block; position: fixed; top: calc(40 * var(--px)); right: calc(31 * var(--px)); z-index: 5; } body.view-b2b .btn-close-overlay svg path { fill: currentColor; } @media (max-width: 700px) { #model-details-overlay { overflow: auto; } #model-details-overlay > .inner { padding-top: 60px; } #model-details-overlay > .inner > .wrap { height: auto; } } @media (max-width: 500px) { .btn-close-overlay { top: 22px; right: 22px; } .btn-close-overlay svg { width: 26px; height: auto; display: block; } } #model-details-overlay header { text-align: center; max-width: calc(630 * var(--px)); margin: 0 auto; } #model-details-overlay header .brand { margin-bottom: 1em; } #model-details-overlay header .name { --min-font-size: 1.625rem; } @media (max-width: 700px) { #model-details-overlay header { margin-bottom: 20px; } #model-details-overlay header .brand { margin-bottom: 0.5em; } } #model-details-overlay { --col-1-width: calc(752 * var(--px)); } #model-details-overlay .body { flex-grow: 1; display: flex; flex-flow: column nowrap; justify-content: center; } #model-details-overlay .body .col-set { display: flex; flex-flow: row nowrap; align-items: center; width: 100%; max-width: calc(1245 * var(--px)); margin: 0 auto; } #model-details-overlay .body .col-set .col-1 { width: var(--col-1-width); } #model-details-overlay .splide__slide, #model-details-overlay .splide__slide img { width: var(--col-1-width); } #model-details-overlay .body .col-set .col-2 { margin-left: auto; width: max(280px, calc(405 * var(--px))); flex-shrink: 0; } .model-details { position: relative; } .model-details > div { position: relative; z-index: 2; padding: max(24px, calc(33 * var(--px))); } .model-details::after { content: ''; display: block; position: absolute; inset: 0; background: var(--base-color-white); z-index: 1; transform: rotate(-1deg); } .model-details-list { display: flex; flex-flow: row wrap; } .model-details-list > li { border-bottom: 1px solid var(--base-color-black); padding: max(9px, calc(12 * var(--px))) 0; width: 100%; } .model-details-list > li.li-33 { width: calc(100% / 3); } .model-details-list > li.li-66 { width: calc((100% / 3) * 2); } .model-details-list > li:first-child { padding-top: 0; } .model-details-list .label { display: block; text-transform: uppercase; margin-bottom: 4px; } .model-details-list .value > span.cpy-10 { display: block; } .model-details-list .value.cpy-12 { line-height: 1.2; display: block; } .model-details .btn-set > div + div { margin-top: max(9px, calc(12 * var(--px))); } @media (max-width: 900px) { #model-details-overlay { --col-1-width: calc(100vw - 280px - 40px); } #model-details-overlay .body .col-set { max-width: none; } } @media (max-width: 700px) { #model-details-overlay .body { justify-content: flex-start; } #model-details-overlay .body .col-set { flex-flow: column nowrap; } #model-details-overlay { --col-1-width: 75vw; } #model-details-overlay .body .col-set .col-2 { width: 100%; max-width: max(370px, 75vw); margin: 0 auto; margin-top: 50px; padding-bottom: 70px; } .model-details .btn-set > div + div { display: none; } .model-details .btn-set > div.bike-builder { display: block; } .model-details::after { display: none; } .model-details > div:first-child { background: var(--base-color-white); } } @media (max-width: 450px) { #model-details-overlay .body .col-set { align-items: flex-start; } #model-details-overlay { --col-1-width: calc(100vw - var(--scrollbar-width)); } #model-details-overlay .body .col-set .col-1 { margin-left: calc(var(--page-padding-left) * -1); } } #model-details-overlay .splide__pagination { gap: max(10px, calc(16 * var(--px))); } #model-details-overlay .splide__pagination__page { --size: max(8px, calc(12 * var(--px))); width: var(--size); height: var(--size); display: inline-block; background: #bfb200; --active-background: #927e17; border-radius: 50px; transition: 750ms var(--ttf-4); transition-property: width, background; } #model-details-overlay .splide__pagination__page.is-active { width: calc(var(--size) * 2); background: var(--active-background); } #model-details-overlay .splide__pagination > li:first-child:last-child { display: none; } @media (max-width: 700px) { #model-details-overlay .splide__pagination { margin-top: 20px; } } .model-details > div.model-form-wrap { position: absolute; top: 15px; left: -15px; width: 100%; min-height: 100%; box-sizing: border-box; z-index: 3; background: var(--base-color-light-purple); box-shadow: 0px 85px 34px rgba(0, 0, 0, 0.01), 0px 48px 29px rgba(0, 0, 0, 0.03), 0px 21px 21px rgba(0, 0, 0, 0.04), 0px 5px 12px rgba(0, 0, 0, 0.05), 0px 0px 0px rgba(0, 0, 0, 0.05); } .model-details > div.model-form-wrap:not(.shown), .model-details > div.model-form-wrap:not(.shown) * { pointer-events: none !important; } .model-details > div.model-form-wrap { transform: scale(0.95); opacity: 0; visibility: hidden; transition: 500ms var(--ttf-4); transition-property: transform, opacity, visibility; transition-delay: 0ms, 0ms, 500ms; } .model-details > div.model-form-wrap.shown { transform: none; opacity: 1; visibility: visible; transition-delay: 0ms, 0ms, 0ms; } .model-details .inquiry-form-headline { color: var(--base-color-dark-purple); margin-bottom: 0.75em; } @media (max-width: 700px) { .model-details > div.model-form-wrap { position: relative; transform: none; opacity: 1; visibility: visible; top: auto; left: auto; width: auto; min-width: 0; min-height: 0; box-shadow: none; margin-top: 20px; } .model-details > div.model-form-wrap:not(.shown), .model-details > div.model-form-wrap:not(.shown) * { pointer-events: all !important; } .form-list--model-inquiry div.cancel { display: none; } .form-list--model-inquiry > li.submit > div { display: block; } .form-list--model-inquiry button[type="submit"] { width: 100%; justify-content: center; } } #model-details-overlay footer { border-top: 1px solid #bfb101; margin-top: auto; } nav.prev-next-model { display: flex; flex-flow: row nowrap; justify-content: space-between; padding: 20px 0 0 0; } nav.prev-next-model a { display: flex; flex-flow: row nowrap; align-items: center; gap: 10px; } nav.prev-next-model img { max-width: max(60px, calc(90 * var(--px))); } nav.prev-next-model .brand { margin-bottom: 4px; } nav.prev-next-model .col-3 { max-width: calc(300 * var(--px)); } nav.prev-next-model svg { display: block; width: max(20px, calc(20 * var(--px))); height: auto; } nav.prev-next-model svg path { fill: currentColor; } nav.prev-next-model a.btn-next-model { flex-flow: row-reverse nowrap; } nav.prev-next-model a.btn-prev-model svg { transform: rotateY(-180deg); } nav.prev-next-model a.btn-next-model .col-3 { text-align: right; } @media (hover: hover) { nav.prev-next-model a { opacity: 0.65; transition: opacity 250ms; } nav.prev-next-model a:is(:hover, :focus) { opacity: 1; } } @media (max-width: 700px) { #model-details-overlay footer { display: none; } } :root { --module-margin-200: max(92px, calc(200 * var(--px))); --module-margin-100: max(92px, calc(100 * var(--px))); --module-margin-75: max(64px, calc(75 * var(--px))); --module-margin-32: max(32px, calc(32 * var(--px))); --module-padding-y: max(64px, calc(90 * var(--px))); } .module.mrgn-200 { margin-bottom: var(--module-margin-200); } .module.mrgn-100 { margin-bottom: var(--module-margin-100); } .module.mrgn-75 { margin-bottom: var(--module-margin-75); } .module.mrgn-32 { margin-bottom: var(--module-margin-32); } .module.mrgn-0-if-last:last-child { margin-bottom: 0; } /* FIRST MODULE */ .modules > .module:first-child:not(.module-hero, .module-home) { margin-top: calc(92 * var(--px)); } /* MODULE HEADER */ .module-header[data-type="a"] { max-width: max(735px, calc(1088 * var(--px))); margin: 0 auto; margin-bottom: max(36px, calc(64 * var(--px))); } .module-header[data-type="a"] > div { max-width: max(585px, calc(864 * var(--px))); } .module-header[data-type="a"] .intro-copy { margin-top: max(12px, .61538461538461538461em); } .headline.has-colored-character span { color: var(--base-color-blue); } /* MODULES WITH BACKGROUND COLORS */ .module[data-background-color] .module-inner { padding-top: var(--module-padding-y); padding-bottom: var(--module-padding-y); } .module[data-background-color] + .module[data-background-color][data-prev-background-color="same"] .module-inner { padding-top: 0; } .module[data-background-color="yellow"] { background-color: var(--base-color-yellow); } .module[data-background-color="purple"] { background-color: var(--base-color-purple); } body.view-b2b .module[data-background-color="purple"] { background-color: var(--base-color-green); color: var(--base-color-black); } .module[data-background-color="gray"] { background-color: var(--base-color-light-gray); } body.view-b2b .module[data-background-color="gray"] { background-color: var(--base-color-darkest-gray); } /* IMAGE CAPTIONS */ .image-caption { --font-size: 14; --min-font-size: .875rem; --max-font-size: .875rem; margin-top: .57142857142857142857em; letter-spacing: 0.02em; line-height: 1.25; } .sn-slider { --gap: calc(40 * var(--px)); user-select: none; } .sn-slider-track { width: 100%; position: relative; overflow: hidden; overflow-x: scroll; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .sn-slider-track::-webkit-scrollbar { display: none; } .sn-slider-slides { display: flex; flex-flow: row nowrap; width: max-content; } .sn-slider-slide { margin-right: var(--gap); } .sn-slider-progress { position: relative; height: 14px; pointer-events: none; } .sn-slider-progress span { display: block; position: absolute; left: 0; height: 100%; width: var(--progress, 0%); background: var(--base-color-black); } #team-details-overlay { position: fixed; inset: 0; z-index: 1005; overflow: clip; --height: 100vh; } #team-details-overlay .background { position: absolute; inset: 0; background: var(--base-color-black); z-index: 1; } #team-details-overlay > .inner { position: relative; z-index: 2; box-sizing: border-box; height: var(--height); } #team-details-overlay > .inner > .wrap { position: relative; display: flex; flex-flow: row nowrap; height: var(--height); } #team-details-overlay .col-1 { width: 50%; position: relative; height: var(--height); } #team-details-overlay .col-1 img { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; } #team-details-overlay .col-2 { width: 50%; display: flex; flex-flow: column nowrap; align-items: center; overflow: auto; height: var(--height); } #team-details-overlay .copy-wrap { width: 72.222222222222222222%; color: var(--base-color-white); padding: 50px 0; margin: auto; } #team-details-overlay .headline { color: var(--base-color-yellow); margin-bottom: .46875em; padding-left: .4375em; --min-font-size: 2.25rem; } #team-details-overlay .headline .icon { padding-top: .5em; width: max(35px, .75em); } #team-details-overlay .headline .icon svg { display: block; width: 100%; height: auto; transform: rotate(90deg); position: relative; } #team-details-overlay .headline .icon svg path { fill: currentColor; } @media (max-width: 600px) { #team-details-overlay > .inner > .wrap { display: block; overflow: auto; } #team-details-overlay .col-1 { width: 100%; height: auto; } #team-details-overlay .col-1 img { position: static; height: auto; aspect-ratio: 1 / 1 !important; } #team-details-overlay .col-2 { width: 100%; height: auto; overflow: hidden; display: block; box-sizing: border-box; padding: var(--page-padding-left ); } #team-details-overlay .copy-wrap { width: 100%; max-width: 430px; padding-top: 75px; } #team-details-overlay .headline { padding-left: 0; margin-bottom: 22px; position: relative; } #team-details-overlay .headline.spanned > span:not(.icon) { display: inline; } #team-details-overlay .headline .icon { position: absolute; left: 0; bottom: calc(100% + 15px); } } :root { --logo-list-gap: max(12px, calc(32 * var(--px))); } .module-brands .module-body { margin-left: calc(var(--page-padding-left) * -1); margin-right: calc(var(--page-padding-right) * -1); overflow: hidden; } .logo-marquee-wrap.row-1 { margin-bottom: var(--logo-list-gap); } .logo-list { display: flex; flex-flow: row nowrap; } .logo-list > li { flex-shrink: 0; margin-right: var(--logo-list-gap); } .logo-list img, .logo-grid img { display: block; width: max(80px, calc(136 * var(--px))); height: auto; } .logo-grid img { width: 100%; } .logo-list .a, .logo-grid .a { display: block; --delay: 5ms; background: var(--base-color-light-gray); transition: var(--ttf-2), var(--ttf-7), var(--ttf-7); transition-property: background-color, opacity, transform; transition-duration: 500ms, 1.5s, 1.5s; transition-delay: 0ms, calc(var(--ios-random, 0) * var(--delay)), calc(var(--ios-random, 0) * var(--delay)); opacity: 0; transform: scale(0.5); } .logo-grid .a { --delay: 25ms; } .is-on-screen .logo-list .a, .is-on-screen .logo-grid .a { opacity: 1; transform: none; } @media (hover: hover) { .logo-list a:is(:hover, :focus), .logo-grid a:is(:hover, :focus) { background: var(--base-color-yellow); } } .module-brands[data-layout="grid"] .module-wrap { max-width: calc(1312 * var(--px)); margin: 0 auto; } .logo-grid { --columns: 6; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: var(--logo-list-gap); --row-gap: var(--column-gap); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .logo-grid > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } .module-contact-persons .module-body { max-width: max(625px, calc(1088 * var(--px))); margin: 0 auto; } .contact-persons-list { --columns: 2; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: max(var(--page-padding-left), calc(32 * var(--px))); --row-gap: max(40px, calc(40 * var(--px))); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .contact-persons-list > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } .contact-person-card { display: flex; flex-flow: row nowrap; gap: max(20px, calc(32 * var(--px))); } .contact-person-card figure { width: max(100px, calc(192 * var(--px))); flex-shrink: 0; } .contact-person-card figure img { border-radius: 50%; display: block; } .contact-person-card .col-2 { width: 100%; } .contact-person-card .cpy-18 { --min-font-size: 1rem; } .contact-person-card .role { text-transform: uppercase; margin-top: .44444444444444444444em; } .contact-person-card .email { margin-top: 1.33333333333333333333em; } .contact-person-card .email a { color: var(--base-color-purple); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: .11111111111111111111em; font-family: var(--base-font-1-demi); } body.view-b2b .contact-person-card .email a { color: var(--base-color-green); } @media (hover: hover) { .contact-person-card .email a:is(:hover, :focus) { text-decoration: none; } } @media (max-width: 600px) { .contact-persons-list { --columns: 1; } .contact-person-card .email { margin-top: 0.5em; } } .module-copy .module-wrap { max-width: max(712px, calc(864 * var(--px))); margin: 0 auto; } .module-copy .wysiwyg strong { font-weight: normal; } .module-copy .wysiwyg .headline { margin-bottom: .55555555555555555555em; --min-font-size: 1.625rem; } .module-copy .wysiwyg .headline:not(:first-child), .module-copy .wysiwyg .subheadline:not(:first-child) { margin-top: 2em; } .module-copy .wysiwyg .subsubheadline:not(:first-child) { margin-top: 1.25em; } .module-copy .wysiwyg a { color: var(--base-color-purple); } body.view-b2b .module-copy .wysiwyg a { color: var(--base-color-green); } .module-cutout-image .module-wrap { --width: calc(1144 * var(--px)); --height: calc(964 * var(--px)); width: var(--width); height: var(--height); background-attachment: fixed; background-position: left center; background-size: cover; -webkit-mask-image: url('data:image/svg+xml,%3Csvg width="1144" height="964" viewBox="0 0 1144 964" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M0 963.415L1077.56 646.133V646.168C1077.56 646.168 1144 627.111 1144 555.248V0L0 336.366V963.415Z" fill="%23FFEE00"/%3E%3C/svg%3E%0A'); -webkit-mask-size: var(--width) var(--height); -webkit-mask-repeat: no-repeat; } @media (hover: none) { .module-cutout-image .module-wrap { background-attachment: scroll; } } .module-facts .module-wrap { max-width: calc(1088 * var(--px)); margin: 0 auto; } .facts-list { --border: 2px solid var(--base-color-black); border-top: var(--border); } body.view-b2b .facts-list { --border: 2px solid var(--base-color-darkest-gray); } .facts-list > li { display: flex; flex-flow: row nowrap; align-items: center; gap: max(12px, calc(24 * var(--px))); border-bottom: var(--border); padding: max(20px, calc(20 * var(--px))) 0; } .facts-list .number { white-space: nowrap; color: var(--base-color-purple); } body.view-b2b .facts-list .number { color: var(--base-color-green); } @media (max-width: 700px) { .module-facts .module-wrap { max-width: none; } } @media (max-width: 600px) { .facts-list > li { flex-flow: column nowrap; gap: 6px; align-items: flex-start; } } .module-faqs .module-body { max-width: calc(1311 * var(--px)); margin: 0 auto; } .module-faqs.has-no-image .module-body { max-width: calc(1152 * var(--px)); } .module-faqs.has-image .col-set { display: flex; flex-flow: row nowrap; } .module-faqs.has-image .col-set .col-1 { width: 48.81769641495041952700%; } .module-faqs.has-image .col-set .col-2 { width: 48.81769641495041952700%; margin-left: auto; } .module-faqs .cpy-20 { line-height: 1.25; --min-font-size: 1.125rem; } .module-faqs .wysiwyg a { color: var(--base-color-purple); } body.view-b2b .module-faqs .wysiwyg a { color: var(--base-color-green); } @media (max-width: 900px) { .module-faqs .module-body { max-width: none !important; } .module-faqs.has-image .col-set { gap: var(--page-padding-left); } .module-faqs.has-image .col-set .col-1 { width: 33%; flex-shrink: 0; } .module-faqs.has-image .col-set .col-2 { width: 100%; } } @media (max-width: 600px) { .module-faqs.has-image .col-set { flex-flow: column-reverse nowrap; } .module-faqs.has-image .col-set .col-1 { width: 100%; margin-top: 1.5em; } .module-faqs.has-image .col-set .col-1 img { aspect-ratio: 1 / 1 !important; object-fit: cover; object-position: center bottom; } } .module-faqs.has-no-image .faqs-list { border-top: 2px solid var(--base-color-black); } .faqs-list > li { border-bottom: 2px solid var(--base-color-black); } body.view-b2b .module-faqs.has-no-image .faqs-list, body.view-b2b .faqs-list > li { border-color: var(--base-color-white); } .faqs-list .faq-question { cursor: pointer; user-select: none; transition: color 500ms var(--ttf-4); position: relative; } .faqs-list .faq-question button[aria-controls] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5; display: block; } .faqs-list [data-accordion-state="opened"] .faq-question { color: var(--base-color-purple); } body.view-b2b .faqs-list [data-accordion-state="opened"] .faq-question { color: var(--base-color-green); } .faqs-list .faq-question > div { padding: max(16px, calc(20 * var(--px))) 0; display: flex; flex-flow: row nowrap; align-items: center; } .faqs-list .faq-question .icon { margin-left: auto; flex-shrink: 0; padding-left: 1.5em; } .faqs-list .faq-question svg { display: block; width: max(25px, calc(34 * var(--px))); height: auto; position: relative; transition: transform 500ms var(--ttf-4); } .faqs-list [data-accordion-state="opened"] .faq-question svg { transform: rotate(90deg); } .faqs-list .faq-question svg path { fill: currentColor; transition: fill 500ms var(--ttf-4); } .faqs-list .faq-answer { max-height: 0px; opacity: 0; pointer-events: none; overflow: hidden; transform: translateY(-20px); transition: 500ms var(--ttf-4); transition-property: max-height, opacity, transform; } .faqs-list [data-accordion-state="opened"] .faq-answer { max-height: var(--max-height, 2000px); opacity: 1; transform: none; pointer-events: all; } .faqs-list .faq-answer > div { padding: 0 0 max(25px, calc(28 * var(--px))) 0; } .faqs-list .faq-answer .images { display: flex; flex-flow: row nowrap; max-width: calc(1040 * var(--px)); margin-top: max(24px, calc(48 * var(--px))); padding-bottom: max(12px, calc(24 * var(--px))); } .faqs-list .faq-answer .image-1 { width: 53.846153846153846153%; margin-right: auto; } .faqs-list .faq-answer .image-2 { width: 43.07692307692307692300%; } @media (max-width: 700px) { .faqs-list .faq-answer .images { max-width: 100%; } } .module-form .module-wrap { max-width: max(735px, calc(864 * var(--px))); margin: 0 auto; } :root { --hero-height: max(280px, calc(500 * var(--px))); } .module-hero { height: var(--hero-height); position: relative; } .module-hero .background img { pointer-events: none; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } body.single-brand .module-hero .background img { object-position: center top; } @media (max-width: 700px) { .module-hero.has-location-details { margin-bottom: calc(var(--module-margin-100) + 80px); } .module-hero .location-details { bottom: -130px; right: var(--page-padding-right); } } @media (max-width: 500px) { .module-hero { margin-bottom: var(--module-margin-75) !important; } .module-hero.has-location-details { margin-bottom: calc(var(--module-margin-75) + 80px) !important; } } .module-hero .logo { position: absolute; bottom: 0; right: calc(176 * var(--px)); transform: translateY(50%); background: var(--base-color-white); border-radius: 50%; --size: max(120px, calc(192 * var(--px))); width: var(--size); height: var(--size); filter: drop-shadow(0px 85px 34px rgba(0, 0, 0, 0.01)) drop-shadow(0px 48px 29px rgba(0, 0, 0, 0.03)) drop-shadow(0px 21px 21px rgba(0, 0, 0, 0.04)) drop-shadow(0px 5px 12px rgba(0, 0, 0, 0.05)) drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.05)); } @media (max-width: 700px) { .module-hero .logo { right: calc(var(--page-padding-right) * 2); } } .module-hero .location-details { position: absolute; bottom: calc(-45 * var(--px)); right: calc(176 * var(--px)); box-shadow: 0px 85px 34px rgba(0, 0, 0, 0.01), 0px 48px 29px rgba(0, 0, 0, 0.03), 0px 21px 21px rgba(0, 0, 0, 0.04), 0px 5px 12px rgba(0, 0, 0, 0.05), 0px 0px 0px rgba(0, 0, 0, 0.05); } .module-hero .location-details .headline { text-transform: uppercase; margin-bottom: .4em; } .module-hero .location-details .location-box .cpy-22 { --min-font-size: 1rem; } @media (max-width: 700px) { .module-hero .location-details { bottom: -130px; right: var(--page-padding-right); } } .module-home { position: relative; } body.view-b2b .module-home { color: var(--base-color-black); } .module-home .module-inner { padding-top: max(30px, calc(120 * var(--px))); } .module-home::after { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: calc(297 * var(--px)); background: var(--base-color-yellow); z-index: 1; } body.view-b2b .module-home::after { background: var(--base-color-green); } .module-home .module-wrap { position: relative; z-index: 2; } .module-home .wysiwyg { position: relative; } .module-home .wysiwyg a { text-decoration: underline; color: var(--base-color-purple); } .module-home .source { text-transform: uppercase; margin-top: max(12px, 0.75em); --min-font-size: .75rem; } .module-home .source::before { content: '—'; margin-right: 0.15em; } .module-home .row-1 { max-width: max(530px, calc(1088 * var(--px))); margin: 0 auto; margin-bottom: max(65px, calc(128 * var(--px))); } .module-home .row-2 img { display: block; position: relative; will-change: transform; transform: scale(var(--image-zoom, 0.67)) translateY(calc((var(--image-zoom, 0.67) - 0.67) * -30vw)); transform-origin: center top; } @media (max-width: 700px) { .module-home .row-1 { padding-left: 35px; } } @media (max-width: 500px) { .module-home .row-1 { padding-left: 0; } .module-home .row-2 img { transform: none; } } @media (max-width: 700px) { .module-home.has-home-teaser .module-inner { padding-top: 160px; } } @media (max-width: 500px) { .module-home.has-home-teaser .module-inner { padding-top: 110px; } } .home-teaser { position: absolute; right: var(--page-padding-right); top: var(--page-padding-left); z-index: 4; --size: max(110px, calc(180 * var(--px))); } @media (min-width: 1440px) { .home-teaser { right: auto; left: calc(50% + 720px - var(--page-padding-right)); transform: translateX(-100%); } } .home-teaser .a { display: block; border-radius: 50%; text-align: center; background: var(--base-color-black); color: var(--base-color-yellow); width: var(--size); height: var(--size); } body.view-b2b .home-teaser .a { color: var(--base-color-white); } .home-teaser .label { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(8deg); padding: 1em; width: 100%; box-sizing: border-box; font-size: calc(var(--size) * .11111111111111111111); } .module-icon-columns { --icon-color: var(--base-color-white); } .module-icon-columns[data-icon-color="green"] { --icon-color: var(--base-color-green); } .module-icon-columns[data-icon-color="black"] { --icon-color: var(--base-color-black); } .module-icon-columns[data-icon-color="purple"] { --icon-color: var(--base-color-purple); } .module-icon-columns[data-icon-color="gray"] { --icon-color: var(--base-color-gray); } .module-icon-columns[data-icon-color="yellow"] { --icon-color: var(--base-color-yellow); } .module-icon-columns[data-icon-color="red"] { --icon-color: var(--base-color-red); } .module-icon-columns[data-icon-color="blue"] { --icon-color: var(--base-color-blue); } .module-icon-columns .module-body { max-width: calc(1311 * var(--px)); margin: 0 auto; } .icon-columns-list { --columns: 3; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: calc(48 * var(--px)); --row-gap: calc(72 * var(--px)); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .icon-columns-list > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); position: relative; opacity: 0; transform: translateY(5vw); --delay: 100ms; transition: 1.5s calc((var(--ios-item-index, 0) * var(--delay)) + 500ms) var(--ttf-7); transition-property: opacity, transform; } .is-on-screen .icon-columns-list > * { opacity: 1; transform: none; } .icon-columns-list .icon { width: max(40px, calc(70 * var(--px))); margin-bottom: max(18px, calc(24 * var(--px))); } .icon-columns-list svg { width: 100%; height: auto; display: block; } .icon-columns-list svg :is(path, circle) { fill: var(--icon-color); } .icon-columns-list .wysiwyg .headline { margin-bottom: 0.25em; } @media (max-width: 900px) { .icon-columns-list { --column-gap: var(--page-padding-left); --row-gap: calc(var(--column-gap) * 2); } .module-icon-columns .module-body { max-width: none !important; } } @media (max-width: 700px) { .icon-columns-list { --columns: 2; } } @media (max-width: 500px) { .icon-columns-list { --columns: 1; text-align: center; } .icon-columns-list .icon { margin-inline: auto; } } .module-image-copy-teaser .module-wrap { max-width: max(890px, calc(1088 * var(--px))); margin: 0 auto; } .module-image-copy-teaser .col-set { display: flex; flex-flow: row nowrap; justify-content: space-between; } .module-image-copy-teaser[data-layout="copy|image"] .col-set { flex-flow: row-reverse nowrap; } .module-image-copy-teaser .col-1 { width: 51.47058823529411764700%; } .module-image-copy-teaser .col-2 { width: 41.26838235294117647%; } .module-image-copy-teaser .wysiwyg .headline { margin-bottom: .44444444444444444444em; } .module-image-copy-teaser .wysiwyg a { color: var(--base-color-purple); } body.view-b2b .module-image-copy-teaser .lnk-c { color: var(--base-color-green); } @media (max-width: 1000px) { .module-image-copy-teaser .col-set { gap: var(--page-padding-left); } .module-image-copy-teaser .col-1 { width: 50%; flex-shrink: 0; } .module-image-copy-teaser .col-2 { width: 100%; } } @media (max-width: 700px) { .module-image-copy-teaser .col-1 { width: 40%; flex-shrink: 0; } .module-image-copy-teaser .col-2 { width: 100%; } } @media (max-width: 500px) { .module-image-copy-teaser[data-layout] .col-set { flex-flow: column nowrap; } .module-image-copy-teaser .col-1 { width: 100%; } } .module-image-copy-teaser-2 { --background-color: var(--base-color-black); --color: var(--base-color-white); --button-background-color: var(--base-color-yellow); --button-color: var(--base-color-black); max-width: 1440px; margin-left: auto; margin-right: auto; } .module-image-copy-teaser-2[data-copy-background-color="yellow"] { --background-color: var(--base-color-yellow); --color: var(--base-color-black); --button-background-color: var(--base-color-purple); --button-color: var(--base-color-white); } .module-image-copy-teaser-2[data-copy-background-color="purple"] { --background-color: var(--base-color-purple); --button-background-color: var(--base-color-yellow); } .module-image-copy-teaser-2 .col-set { display: flex; flex-flow: row nowrap; } .module-image-copy-teaser-2[data-layout="copy|image"] .col-set { flex-flow: row-reverse nowrap; } .module-image-copy-teaser-2 .col-1 { width: 50%; position: relative; aspect-ratio: 1 / 1; } .module-image-copy-teaser-2 .col-1 img { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .module-image-copy-teaser-2 .col-2 { width: 50%; background: var(--background-color); color: var(--color); display: flex; flex-flow: column nowrap; justify-content: center; } .module-image-copy-teaser-2 .col-2 > div { align-self: center; padding: max(40px, calc(80 * var(--px))); } .module-image-copy-teaser-2 .wysiwyg .headline { margin-bottom: max(12px, .44444444444444444444em); --min-font-size: 1.625rem; } .module-image-copy-teaser-2 .wysiwyg a { color: var(--base-color-purple); } .module-image-copy-teaser-2 .btn-set { margin-top: max(24px, calc(24 * var(--px))); } .module-image-copy-teaser-2 .btn { --color: var(--button-color); --background-color: var(--button-background-color); } @media (max-width: 700px) { .module-image-copy-teaser-2 .module-inner { padding-left: 0; padding-right: 0; } .module-image-copy-teaser-2 .col-1 { display: none; } .module-image-copy-teaser-2 .col-2 { width: 100%; } } @media (max-width: 500px) { .module-image-copy-teaser-2 .col-set { flex-flow: column nowrap; } .module-image-copy-teaser-2 .col-1 { display: block; width: 100%; } .module-image-copy-teaser-2 .col-2 > div { padding: calc(var(--page-padding-left) * 2) var(--page-padding-left) calc(var(--page-padding-left) * 2.5); } } .module-image-stack-teaser .module-wrap { max-width: max(980px, calc(1088 * var(--px))); margin: 0 auto; } .module-image-stack-teaser .col-set { display: flex; flex-flow: row nowrap; align-items: center; } .module-image-stack-teaser .col-1 { width: 44.48529411764705882300%; } .module-image-stack-teaser .col-2 { width: 51.47058823529411764700%; margin-left: auto; } .module-image-stack-teaser .kicker { color: var(--base-color-gray); text-transform: uppercase; margin-bottom: max(12px, .75em); } .module-image-stack-teaser .headline { margin-bottom: max(12px, .30769230769230769230em); } .module-image-stack-teaser .btn-set { margin-top: max(20px, calc(20 * var(--px))); } .module-image-stack-teaser .wysiwyg { --min-font-size: 1.125rem; } @media (max-width: 1100px) { .module-image-stack-teaser .module-wrap { max-width: 850px; } .module-image-stack-teaser .col-set { gap: var(--page-padding-left); } .module-image-stack-teaser .col-1 { width: 100%; } .module-image-stack-teaser .col-2 { width: 45%; flex-shrink: 0; margin-right: auto; } } @media (max-width: 700px) { .module-image-stack-teaser .col-set { flex-flow: row-reverse nowrap; align-items: flex-start; } .module-image-stack-teaser .col-2 { width: 40%; } .module-image-stack-teaser .image-stack { max-width: 90%; margin: 0 auto; } } @media (max-width: 500px) { .module-image-stack-teaser .col-set { flex-flow: column-reverse nowrap; gap: calc(var(--page-padding-left) * 2); } .module-image-stack-teaser .col-1, .module-image-stack-teaser .col-2 { width: 100%; } .module-image-stack-teaser .image-stack { max-width: 295px; } } .module-image-stack-teaser .image-stack { position: relative; aspect-ratio: 560 / 535; } .module-image-stack-teaser .portrait-image { display: block; position: absolute; top: 0; right: 0; width: 54.285714285714285714%; z-index: 3; transform: translate(-25%, 50%); transition: transform 1500ms 20ms var(--ttf-7); } .module-image-stack-teaser.is-on-screen .portrait-image { transform: none; } .module-image-stack-teaser .landscape-image { display: block; position: absolute; left: 0; bottom: 5.794392523364485981%; width: 72.321428571428571428%; z-index: 2; transform: translate(25%, 50%); transition: transform 1500ms var(--ttf-7); } .module-image-stack-teaser.is-on-screen .landscape-image { transform: none; } .module-image-stack-teaser .background { aspect-ratio: 440 / 500; background: var(--base-color-gray); position: absolute; top: 3.17757009345794392500%; left: 9.821428571428571428%; width: 78.571428571428571428%; z-index: 1; transform: translateY(50%); transition: transform 1500ms 40ms var(--ttf-7); } .module-image-stack-teaser.is-on-screen .background { transform: rotate(-3deg); } .module-large-copy .module-wrap { max-width: max(605px, calc(1152 * var(--px))); margin: 0 auto; } .module-large-copy .wysiwyg > *:not(:last-child) { margin-bottom: 0.5em; } .module-large-headline .module-wrap { max-width: calc(1152 * var(--px)); margin: 0 auto; } .module-large-headline .headline { max-width: calc(1088 * var(--px)); position: relative; } .module-large-headline.mrgn-0 .headline { margin-bottom: max(16px, .33333333333333333333em); } .module-large-headline .icon, .module-home .icon { position: absolute; right: calc(100% + (23 * var(--px))); top: 0; } .module-large-headline .icon svg, .module-home .icon svg { width: max(28px, calc(var(--icon-width) * var(--px))); height: auto; display: block; } .module-large-headline .icon svg { transform: scale(0); transition: transform 1s 1s var(--ttf-8); } .module-large-headline.is-on-screen .icon svg { transform: none; } @media (max-width: 500px) { .module-large-headline .module-wrap { max-width: none; padding-top: 3.3em; } .module-home .row-1 { padding-top: 3.3em; position: relative; } .module-home .module-wrap { max-width: none; } .module-large-headline .headline, .module-home .headline { max-width: none; } .module-large-headline .icon, .module-home .icon { left: 0; top: auto; right: auto; bottom: calc(100% + 25px); margin-bottom: 0 !important; } .module-large-headline .icon svg, .module-home .icon svg { transform: rotate(90deg) !important; } } .module-locations-teaser .module-body { max-width: max(1312px, calc(1312 * var(--px))); margin: 0 auto; } .locations-teaser-grid { --columns: 3; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: max(var(--page-padding-left), calc(32 * var(--px))); --row-gap: var(--column-gap); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .locations-teaser-grid > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } @media (max-width: 900px) { .module-locations-teaser .module-body { margin-left: calc(var(--page-padding-left) * -1); margin-right: calc(var(--page-padding-right) * -1); overflow: hidden; overflow-x: auto; } .locations-teaser-grid { flex-flow: row nowrap; margin: 0; } .locations-teaser-grid > * { width: auto; flex-shrink: 0; margin-right: 0; padding-left: var(--page-padding-left); } .locations-teaser-grid > *:last-child { padding-right: var(--page-padding-right); } .locations-teaser-grid article.locations-teaser { width: 274px; } } @media (max-width: 500px) { .module-locations-teaser .module-body { -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; } .module-locations-teaser .module-body::-webkit-scrollbar { display: none; } .locations-teaser-grid > * { scroll-snap-align: start; } } article.locations-teaser { position: relative; } body.view-b2b article.locations-teaser { color: var(--base-color-black); } article.locations-teaser img { pointer-events: none; } article.locations-teaser > .row-2 { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-flow: column nowrap; box-sizing: border-box; z-index: 2; padding: max(20px, calc(32 * var(--px))); } article.locations-teaser .headline { text-align: center; color: var(--base-color-white); } @media (max-width: 500px) { article.locations-teaser > .row-2 { padding-top: 24px; } } .location-box { margin-top: auto; background: var(--base-color-white); padding: max(16px, calc(16 * var(--px))); } .location-box .row-1 { line-height: 1.45; } .location-box .row-2 { margin: max(12px, calc(12 * var(--px))) 0; } .location-box .row-3 { display: flex; flex-flow: row nowrap; align-items: center; border-top: 1px dashed #d0d0d0; padding-top: max(8px, calc(12 * var(--px))); } .location-box .row-3 > li:not(:last-child)::after { content: '|'; display: inline-block; padding: 0 0.5em; top: 2px; position: relative; } .location-box .address span { display: inline-block; } @media (max-width: 1100px) { .location-box .row-3 { flex-flow: column nowrap; align-items: flex-start; } .location-box .row-3 > li::after { display: none !important; } } body.view-model-overview .module-hero:first-child { margin-bottom: calc(var(--hero-height) * -1); } .module-model-overview .row--filter { box-sizing: border-box; } .model-filter-form { position: sticky; top: 100px; z-index: 10; pointer-events: none; } .model-filter { background: var(--base-color-white); margin: 0 auto; width: 100%; max-width: max(1088px, calc(1088 * var(--px))); box-shadow: var(--box-shadow); border-top: 6px solid var(--base-color-purple); position: relative; pointer-events: all; transition: transform 500ms var(--ttf-4); --padding: max(20px, calc(24 * var(--px))); --box-shadow: 0px 100px 80px rgba(0, 0, 0, 0.07), 0px 64.8148px 46.8519px rgba(0, 0, 0, 0.0531481), 0px 38.5185px 25.4815px rgba(0, 0, 0, 0.0425185), 0px 20px 13px rgba(0, 0, 0, 0.035), 0px 8.14815px 6.51852px rgba(0, 0, 0, 0.0274815), 0px 1.85185px 3.14815px rgba(0, 0, 0, 0.0168519); --label-width: max(120px, calc(200 * var(--px))); } body.view-b2b .model-filter { border-top-color: var(--base-color-green); color: var(--base-color-black); } @media (min-width: 601px) { body.scrolled-more:not([data-scroll-dir="up"]) .model-filter { transform: translateY(calc(var(--header-height, 0px) * -1)); } } .model-filter .mf-header { padding: var(--padding); color: var(--base-color-purple); } body.view-b2b .model-filter .mf-header { color: var(--base-color-green); } .model-filter .mf-header .col-set { position: relative; display: flex; flex-flow: row nowrap; align-items: center; } .model-filter .mf-header .col-1 { cursor: pointer; user-select: none; padding-right: 30px; } .model-filter .mf-header .col-3 { padding-left: 30px; } .btn-toggle-filter { position: relative; --size: max(20px, calc(29 * var(--px))); width: var(--size); height: var(--size); display: block; } .btn-toggle-filter span { display: block; position: absolute; inset: 0; transition: transform 750ms var(--ttf-7); } .model-filter[data-state="expanded"] .btn-toggle-filter span.plus { transform: rotate(-45deg); } .btn-toggle-filter svg { width: 100%; height: auto; display: block; } .btn-toggle-filter svg path { fill: currentColor; } .model-filter .mf-body { max-height: 0px; position: relative; overflow: hidden; opacity: 0; transform: translateY(-40px); transition: 750ms var(--ttf-7); pointer-events: none; background: var(--base-color-white); box-shadow: var(--box-shadow); position: absolute; top: 100%; left: 0; width: 100%; } .model-filter[data-state="expanded"] .mf-body { max-height: var(--max-height, 2000px); opacity: 1; transform: none; pointer-events: all; } .model-filter .mf-body > .inner { padding: var(--padding); padding-top: 0; } .model-filter .mf-actions { display: flex; flex-flow: row nowrap; padding-top: var(--padding); padding-left: var(--label-width); align-items: center; justify-content: space-between; } @media (max-width: 600px) { .btn-toggle-filter { --size: 28px; } body.view-model-overview .module-hero { display: none; } .model-filter { border-top: 0; } .model-filter-form { position: fixed; top: var(--header-height); left: 0; right: 0; } .model-filter-form[data-state="expanded"] { pointer-events: all; } .model-filter-headline::before { content: ''; display: block; position: absolute; inset: calc(var(--padding) * -1); z-index: 3; } .model-filter .mf-body { transform: scale(0.98); max-height: none !important; position: fixed; top: calc(var(--header-height) + 68px); left: 0; right: 0; bottom: 0; } .model-filter .mf-actions { position: absolute; bottom: 0; left: 0; right: 0; background: var(--base-color-yellow); padding: var(--padding); } .model-filter .mf-body > .inner { padding: 0; } } .mf-list { border-bottom: 1px solid var(--base-color-black); } .mf-list > li { display: flex; flex-flow: row nowrap; align-items: center; border-top: 1px solid var(--base-color-black); padding: 12px 0; } .mf-list > li > .label { width: var(--label-width); flex-shrink: 0; } .mf-list > li > .value { width: 100%; } .mf-list-items { display: flex; flex-flow: row wrap; --gap: 12px; margin-bottom: calc(var(--gap) * -1); } .mf-list-items > li { margin-right: var(--gap); margin-bottom: var(--gap); } @media (max-width: 600px) { .mf-list-wrap { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: auto; } .mf-list { padding: var(--padding); border-bottom: 0; padding-top: 0; padding-bottom: 90px; } } @media (max-width: 500px) { .mf-list > li { flex-flow: column nowrap; padding-bottom: 16px; border-top: 0; } .mf-list > li > .label { width: 100%; font-size: 16px; margin-bottom: 8px; } .mf-list-items { --gap: 8px; } } .model-filter .mf-header .col-2 { flex-grow: 1; text-align: center; margin: 0 auto; position: relative; overflow-x: auto; overflow-y: clip; position: relative; -webkit-mask-image: linear-gradient(to right, transparent 0px, black 50px, black calc(100% - 50px), transparent 100%); -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .model-filter .mf-header .col-2::-webkit-scrollbar { display: none; } .mf-active-filters { display: inline-flex; flex-flow: row nowrap; color: var(--base-color-purple); padding: 0 20px; } body.view-b2b .mf-active-filters { color: var(--base-color-green); } .mf-active-filters-sum { display: none; } .mf-active-filters, .mf-active-filters * { white-space: nowrap; } .mf-active-filters > li { position: relative; padding: 0 .75em; } .mf-active-filters > li:not(:last-child) { border-right: 1px solid #b6b6b6; } @media (max-width: 600px) { .mf-active-filters { display: none; } .mf-active-filters-sum { display: inline; } } .module-model-overview .row--intro { padding-top: var(--hero-height); max-width: max(470px, calc(742 * var(--px))); margin: 0 auto max(50px, calc(92 * var(--px))) auto; } .module-model-overview .row--intro .col-set { display: flex; flex-flow: row nowrap; } .module-model-overview .row--intro .col-1 { flex-shrink: 0; } .module-model-overview .row--intro .col-2 { width: 100%; margin-left: max(20px, calc(48 * var(--px))); } .module-model-overview .row--intro .cpy-22 { --min-font-size: .875rem; } .current-selection-counter { aspect-ratio: 134 / 134; position: relative; width: max(95px, calc(134 * var(--px))); } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .current-selection-counter .image { display: block; position: absolute; inset: 0; z-index: 1; background: url(/content/themes/isicargo/imgs/aktuelle-auswahl.svg?x61486) no-repeat center center; background-size: contain; animation: rotate 30s linear infinite; } body.view-b2b .current-selection-counter .image { background-image: url(/content/themes/isicargo/imgs/aktuelle-auswahl-b2b.svg?x61486); } .current-selection-counter .copy { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--base-color-purple); } body.view-b2b .current-selection-counter .copy { color: var(--base-color-green); } .current-selection-counter .number { font-size: max(32px, calc(48 * var(--px))); display: block; line-height: 1; text-align: center; font-family: var(--base-font-1-demi); letter-spacing: 0.013em; } .current-selection-counter .label { font-size: max(10px, calc(14 * var(--px))); text-transform: uppercase; display: block; line-height: 1; text-align: center; font-family: var(--base-font-1-bold); letter-spacing: 0.15em; } @media (max-width: 600px) { .module-model-overview .row--intro { padding-top: 110px; } } @media (max-width: 500px) { .module-model-overview .row--intro .col-set { flex-flow: column-reverse nowrap; } .module-model-overview .row--intro .col-1 { align-self: center; margin-top: 24px; } .module-model-overview .row--intro .col-2 { margin-left: 0; text-align: center; max-width: 75vw; margin: 0 auto; } .current-selection-counter { width: 120px; } .current-selection-counter .number { font-size: 42px; font-family: var(--base-font-1-bold); } .current-selection-counter .label { font-size: 12px; } } .module-model-overview .row--models { max-width: max(1312px, calc(1312 * var(--px))); margin: 0 auto; } .models-grid { --columns: 4; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: max(20px, calc(32 * var(--px))); --row-gap: var(--column-gap); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .models-grid > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } @media (max-width: 950px) { .models-grid { --columns: 3; } } @media (max-width: 750px) { .models-grid { --columns: 2; } } article.model-teaser { background: var(--base-color-lightest-gray); text-align: center; } body.view-b2b article.model-teaser { background: var(--base-color-white); color: var(--base-color-black); } article.model-teaser .hdln-24 { --min-font-size: 1rem; } article.model-teaser a { display: flex; flex-flow: column nowrap; aspect-ratio: 304 / 308; padding: 20px 11px; padding-bottom: 35px; box-sizing: border-box; position: relative; } article.model-teaser a > *:not(.card-background, .special-offer) { position: relative; z-index: 3; } article.model-teaser .brand { text-transform: uppercase; margin-bottom: .8em; } article.model-teaser .row-2 { margin-top: auto; } article.model-teaser img { will-change: transform; display: block; transition: transform 750ms var(--ttf-2); } @media (hover: hover) { article.model-teaser a:is(:hover, :focus) img { transform: scale(1.05); } } article.model-teaser .special-offer { position: absolute; left: 0; bottom: 0; z-index: 2; background: var(--base-color-purple); color: var(--base-color-white); --size: max(23px, calc(44 * var(--px))); width: var(--size); height: var(--size); font-size: max(10px, calc(20 * var(--px))); font-family: var(--base-font-1-bold); clip-path: polygon(0 0, 0 0, 100% 100%, 0% 100%); } article.model-teaser .special-offer > span { display: block; position: absolute; left: 4px; bottom: 2px; line-height: 1; } @media (max-width: 500px) { article.model-teaser a { padding: 11px 6px 14px; } } .module-service-partners .module-wrap { max-width: max(712px, calc(864 * var(--px))); margin: 0 auto; } .module-service-partners .logo-list { flex-flow: row wrap; gap: var(--logo-list-gap); } .module-service-partners .logo-list > li { margin-right: 0; } @media (max-width: 1170px) { .module-service-partners .logo-list { --columns: 6; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: var(--logo-list-gap); --row-gap: var(--column-gap); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; gap: 0px; } .module-service-partners .logo-list > li { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } .module-service-partners .logo-list img { width: auto; } } @media (max-width: 600px) { .logo-grid, .module-service-partners .logo-list { --columns: 5; } } @media (max-width: 500px) { .logo-grid, .module-service-partners .logo-list { --columns: 4; } } @media (max-width: 450px) { .logo-grid, .module-service-partners .logo-list { --columns: 3; } } .module-slider .slideshow { --slide-gap: max(20px, calc(32 * var(--px))); --slide-height: max(225px, calc(450 * var(--px))); margin-left: calc(var(--page-padding-left) * -1); margin-right: calc(var(--page-padding-right) * -1); } .module-slider figure { width: min-content; } .module-slider figure img { height: var(--slide-height); width: auto; display: block; max-width: none; } .gallery-nav { position: absolute; top: 0; left: 0; right: 0; height: var(--slide-height, 100%); z-index: 2; } @media (hover: none) and (max-width: 500px) { .gallery-nav { display: none; } } .gallery-nav button { display: block; position: absolute; top: 0; left: 0; width: 50%; height: 100%; } .gallery-nav button.btn-next { left: 50%; } @media (hover: none) and (max-width: 500px) { .slideshow[data-touch-scroll="true"] .splide__slide--clone { display: none; } .slideshow[data-touch-scroll="true"] .splide__list { transform: none !important; width: max-content; padding-left: var(--slide-gap) !important; } .slideshow[data-touch-scroll="true"] .splide__track { overflow: auto; overflow: hidden; overflow-x: scroll; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; } .slideshow[data-touch-scroll="true"] .splide__slide { scroll-snap-align: center; } .slideshow[data-touch-scroll="true"] .splide__track::-webkit-scrollbar { display: none; } } .module-static-faqs .module-body { max-width: max(700px, calc(864 * var(--px))); margin: 0 auto; } .static-faqs-list > li { opacity: 0; transform: translateY(5vw); transition: 1s calc((var(--ios-item-index, 0) * 200ms) + 500ms) var(--ttf-7); } .module-static-faqs .is-on-screen .static-faqs-list > li { opacity: 1; transform: none; } .static-faqs-list > li + li { margin-top: max(32px, calc(64 * var(--px))); } .static-faqs-list .headline { margin-bottom: max(12px, .55555555555555555555em); --min-font-size: 1.625rem; } .team-grid { --columns: 4; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: calc(32 * var(--px)); --row-gap: calc(80 * var(--px)); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .team-grid > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } article.person-card a, article.person-card span.a { display: block; transition: color 500ms var(--ttf-2); position: relative; } article.person-card figure { position: relative; } article.person-card figure > div:not(.card-background) { position: relative; z-index: 2; } article.person-card .card-background .yellow { background: transparent; } article.person-card figure img { filter: grayscale(1); transition: filter 500ms var(--ttf-2); } article.person-card figure { margin-bottom: max(10px, calc(16 * var(--px))); } article.person-card .role { margin-top: .5em; text-transform: uppercase; letter-spacing: 0.05em; hyphens: auto; } article.jobs-teaser .name { text-transform: uppercase; } article.person-card .hdln-36 { --min-font-size: 1.125rem; } article.person-card .cpy-16 { --min-font-size: .625rem; } @media (hover: hover) { article.person-card a:is(:hover, :focus) { color: var(--base-color-purple); } body.view-b2b article.person-card a:is(:hover, :focus) { color: var(--base-color-green); } article.person-card a:is(:hover, :focus) figure img { filter: none; } } @media (max-width: 800px) { .team-grid { --columns: 3; --column-gap: var(--page-padding-left); --row-gap: 40px; } } @media (max-width: 500px) { .team-grid { --columns: 2; --column-gap: var(--page-padding-left); --row-gap: 40px; } } .module-teaser-slider .module-body { --max-width: max(820px, calc(1152 * var(--px))); max-width: var(--max-width); margin: 0 auto; } .module-teaser-slider .splide__slide { padding: 0 11px; display: flex; flex-flow: column nowrap; } .teaser-slider-nav { margin-top: max(20px, calc(20 * var(--px))); display: flex; flex-flow: row nowrap; justify-content: right; align-items: center; gap: max(18px, calc(32 * var(--px))); } .teaser-slider-nav svg { width: max(30px, calc(52 * var(--px))); height: auto; display: block; } .teaser-slider-nav .btn-prev svg { transform: rotateY(-180deg); } .teaser-slider-nav svg path { fill: var(--base-color-black); } body.view-b2b .teaser-slider-nav svg path { fill: var(--base-color-white); } .teaser-slider-nav .slide-counter .divider { padding-right: 0.1em; } .teaser-slider-nav .slide-counter > span:not(.current) { font-size: 60%; position: relative; transform: translateY(30%); display: inline-block; } @media (max-width: 500px) { .teaser-slider-nav { display: none; } } article.teaser-slider-article { background: var(--base-color-black); color: var(--base-color-white); display: flex; flex-flow: row nowrap; align-items: center; flex-grow: 1; width: var(--max-width); box-sizing: border-box; aspect-ratio: 1152 / 532; --padding: max(20px, calc(32 * var(--px))); position: relative; } article.teaser-slider-article::after { content: ''; display: block; position: absolute; top: 50%; left: calc(-11 * var(--px)); transform: translateY(-50%); width: 100%; max-width: max(405px, calc(571 * var(--px))); height: auto; aspect-ratio: 571 / 479; background: url(/content/themes/isicargo/imgs/bg-teaser-slider.svg?x61486) no-repeat left center; background-size: contain; z-index: 1; } .module-teaser-slider[data-image-type="photo"] article.teaser-slider-article::after { display: none; } @media (max-width: 850px) { article.teaser-slider-article { width: calc(100vw - var(--scrollbar-width) - 11px - (var(--page-padding-left) * 2)); align-items: flex-start; } article.teaser-slider-article::after { max-width: 46%; top: 24px; transform: none; } } @media (max-width: 500px) { article.teaser-slider-article { flex-flow: column nowrap; width: calc(100vw - 75px); } article.teaser-slider-article::after { width: 80%; top: 24px; max-width: none; } .module-teaser-slider .module-body { margin: 0 calc(var(--page-padding-left) * -1); max-width: none; } .module-teaser-slider .splide__slide { padding: 0 0 0 var(--page-padding-left); scroll-snap-align: start !important; } .module-teaser-slider .splide__list { transform: none !important; width: min-content; padding-right: var(--page-padding-left) !important; } .module-teaser-slider .splide__slide--clone { display: none; } .module-teaser-slider .splide__track { overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; } .module-teaser-slider .splide__track::-webkit-scrollbar { display: none; } } article.teaser-slider-article .col--image { width: 48%; box-sizing: border-box; padding: var(--padding); position: relative; z-index: 2; } article.teaser-slider-article .col--image img { max-width: max(333px, calc(470 * var(--px))); height: auto; display: block; } article.teaser-slider-article .col--copy { width: 52%; box-sizing: border-box; padding: calc(var(--padding) * 2) var(--padding); padding-left: 0; align-self: flex-start; } .module-teaser-slider[data-image-type="photo"] article.teaser-slider-article .col--copy { align-self: center; } article.teaser-slider-article .col--copy > div { max-width: max(333px, calc(464 * var(--px))); margin: auto; } article.teaser-slider-article .col--copy .btn-set { margin-top: max(20px, calc(40 * var(--px))); } article.teaser-slider-article .wysiwyg .headline { color: var(--base-color-yellow); margin-bottom: max(12px, .33333333333333333333em); } body.view-b2b article.teaser-slider-article .wysiwyg .headline { color: var(--base-color-green); } article.teaser-slider-article .wysiwyg em { font-style: normal; font-family: var(--base-font-1-italic); } @media (max-width: 850px) { article.teaser-slider-article .col--image img { max-width: 100%; } } @media (max-width: 500px) { article.teaser-slider-article .col--image { width: 90%; margin: 0 auto; } .module-teaser-slider[data-image-type="photo"] article.teaser-slider-article .col--image { width: 100%; } article.teaser-slider-article .col--copy { width: 100%; padding: var(--padding); padding-bottom: 32px; padding-top: 0; } article.teaser-slider-article .col--copy .cpy-20 { line-height: 1.45; } } .three-images-grid { aspect-ratio: 1376 / 576; position: relative; max-width: calc(1376 * var(--px)); margin: 0 auto; } .three-images-grid .image-1 { position: absolute; top: 0; left: calc(117 * var(--px)); width: calc(203 * var(--px)); } .three-images-grid .image-2 { position: absolute; bottom: 0; left: 0; width: calc(320 * var(--px)); } .three-images-grid .image-3 { position: absolute; top: 0; right: 0; width: calc(1024 * var(--px)); } .three-images-grid figcaption { position: absolute; top: 100%; right: 0; width: 100%; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: none; /* FIXME */ } @media (max-width: 800px) { .three-images-grid .image-3 { width: calc(758 * var(--px) - 20px); } .three-images-grid .image-2 { width: calc(645 * var(--px) - 20px); } .three-images-grid .image-1 { display: none; } } @media (max-width: 500px) { .module-three-images .module-body { margin: 0 calc(var(--page-padding-left) * -1); overflow: hidden; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; } .module-three-images .module-body::-webkit-scrollbar { display: none; } .three-images-grid { display: flex; flex-flow: row nowrap; max-width: none; width: max-content; aspect-ratio: auto; padding-right: var(--page-padding-right); } .three-images-grid .image-1 { display: block; } .three-images-grid > [class*="image-"] { width: auto; height: auto; position: static; padding-left: var(--page-padding-left); scroll-snap-align: center; } .three-images-grid img { width: auto; max-width: none; height: 225px; } } .module-two-col-copy .module-wrap { max-width: max(886px, calc(1088 * var(--px))); margin: 0 auto; } .module-two-col-copy .headline { margin-bottom: .55555555555555555555em; --min-font-size: 1.625rem; } .module-two-col-copy .wysiwyg { column-count: 2; column-gap: max(20px, calc(32 * var(--px))); } @media (min-width: 601px) { .module-two-col-copy .wysiwyg > * { margin-bottom: 0; } } .module-two-col-copy .wysiwyg strong { font-weight: normal; } .module-two-col-copy .wysiwyg a { color: var(--base-color-purple); } @media (max-width: 600px) { .module-two-col-copy .wysiwyg { column-count: 1; } } .module-two-images .col-set { display: flex; flex-flow: row nowrap; max-width: calc(1088 * var(--px)); margin: 0 auto; } .module-two-images.has-single-image .col-set { justify-content: center; } .module-two-images [data-ios-item] { opacity: 0; transform: translateY(5vw); transition: 1s calc(var(--ios-item-index, 0) * 100ms) var(--ttf-7); transition-property: opacity, transform; } .module-two-images.is-on-screen [data-ios-item] { opacity: 1; transform: none; } .module-two-images .col-1 { width: 58.82352941176470588200%; } .module-two-images .col-2 { width: 27.94117647058823529400%; margin-left: auto; padding-top: calc(174 * var(--px)); } @media (max-width: 600px) { .module-two-images .module-inner { padding-left: 0; padding-right: 0; } .module-two-images .col-set { max-width: none; } } @media (max-width: 500px) { .module-two-images .col-set { flex-flow: column nowrap; } .module-two-images .col-1 { width: calc(296 * var(--px-mobile)); } .module-two-images .col-2 { padding-top: 48px; width: calc(177 * var(--px-mobile)); } } :root { --plyr-color-main: var(--base-color-yellow); --plyr-video-control-color: var(--base-color-black); --plyr-video-control-color-hover: var(--base-color-black); } .plyr__controls { --plyr-video-control-color: var(--base-color-yellow); --plyr-video-control-color-hover: var(--base-color-black); } .module-video .module-body { max-width: max(1024px, calc(1280 * var(--px))); margin-inline: auto; } .module-video video { width: 100%; height: auto; display: block; } .module-video-manuals .module-body { max-width: max(1312px, calc(1312 * var(--px))); margin: 0 auto; } .video-manuals-grid { --columns: 3; --base-width: 100%; --column-width: calc((var(--base-width) - (var(--column-gap) * var(--columns))) / var(--columns)); --column-gap: max(var(--page-padding-left), calc(32 * var(--px))); --row-gap: var(--column-gap); margin-right: calc(var(--column-gap) * -1); margin-bottom: calc(var(--row-gap) * -1); display: flex; flex-flow: row wrap; } .video-manuals-grid > * { width: var(--column-width); margin-right: var(--column-gap); margin-bottom: var(--row-gap); } .module-video-manuals video { object-fit: cover; } .module-video-manuals .plyr__poster { background-size: cover; } @media (max-width: 900px) { .module-video-manuals .module-body { margin-left: calc(var(--page-padding-left) * -1); margin-right: calc(var(--page-padding-right) * -1); overflow: hidden; overflow-x: auto; } .video-manuals-grid { flex-flow: row nowrap; margin: 0; } .video-manuals-grid > * { width: auto; flex-shrink: 0; margin-right: 0; padding-left: var(--page-padding-left); } .video-manuals-grid > *:last-child { padding-right: var(--page-padding-right); } .video-manuals-grid article.video-manual-teaser { width: 274px; } } @media (max-width: 500px) { .module-video-manuals .module-body { -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; } .module-video-manuals .module-body::-webkit-scrollbar { display: none; } .video-manuals-grid > * { scroll-snap-align: start; } } article.video-manual-teaser { position: relative; } body.view-b2b article.video-manual-teaser { color: var(--base-color-black); } article.video-manual-teaser .headline { margin-bottom: 0.5em; } article.video-manual-teaser { display: flex; flex-flow: column nowrap; gap: 32px 0; }