.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .no-opacity { opacity: 1  !important; } .video-panel-title { font-size: 27.34px; font-weight: 500; line-height: 32.808px; margin-bottom: 8px  !important; } .able-video { position: relative; } .video-controls { position: absolute; bottom: 200px; left: 0; right: 0; display: flex; gap: 12px; align-items: center; justify-content: center; background: rgba(0, 0, 0, .5); padding: 5px; } .hidden-control { display: none; } .video-controls button, .video-controls input[type="range"] { color: white; background: transparent; border: none; cursor: pointer; } .carousel-controls button:focus-visible { outline: 1px solid #fff; outline-offset: 1px; border-radius: 4px; } .carousel-controls .no-focus-outline button:focus-visible { outline: 1px solid #fff; border-radius: 4px; } .carouselOne-ContentOne.video-controls input[type="range"], .carouselOne-ContentTwo.video-controls input[type="range"], .carouselOne-ContentThree.video-controls input[type="range"], .carouselTwo-ContentOne.video-controls input[type="range"], .carouselTwo-ContentTwo.video-controls input[type="range"], .carouselTwo-ContentThree.video-controls input[type="range"], .carouselThree-ContentOne.video-controls input[type="range"], .carouselThree-ContentTwo.video-controls input[type="range"], .carouselThree-ContentThree.video-controls input[type="range"] { -webkit-appearance: none; width: 150px; height: 6px; border-radius: 3px; background: linear-gradient( to right, #f8f8f8 0%, #f8f8f8 var(--value, 50%), #666 var(--value, 50%), #666 100% ); cursor: pointer; } .carouselOne-ContentOne.video-controls input[type="range"]::-webkit-slider-thumb, .carouselOne-ContentTwo.video-controls input[type="range"]::-webkit-slider-thumb, .carouselOne-ContentThree.video-controls input[type="range"]::-webkit-slider-thumb, .carouselTwo-ContentOne.video-controls input[type="range"]::-webkit-slider-thumb, .carouselTwo-ContentTwo.video-controls input[type="range"]::-webkit-slider-thumb, .carouselTwo-ContentThree.video-controls input[type="range"]::-webkit-slider-thumb, .carouselThree-ContentOne.video-controls input[type="range"]::-webkit-slider-thumb, .carouselThree-ContentTwo.video-controls input[type="range"]::-webkit-slider-thumb, .carouselThree-ContentThree.video-controls input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 1px solid #333; cursor: pointer; } .carouselOne-ContentOne.video-controls input[type="range"]::-moz-range-thumb, .carouselOne-ContentTwo.video-controls input[type="range"]::-moz-range-thumb, .carouselOne-ContentThree.video-controls input[type="range"]::-moz-range-thumb, .carouselTwo-ContentOne.video-controls input[type="range"]::-moz-range-thumb, .carouselTwo-ContentTwo.video-controls input[type="range"]::-moz-range-thumb, .carouselTwo-ContentThree.video-controls input[type="range"]::-moz-range-thumb, .carouselThree-ContentOne.video-controls input[type="range"]::-moz-range-thumb, .carouselThree-ContentTwo.video-controls input[type="range"]::-moz-range-thumb, .carouselThree-ContentThree.video-controls input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 1px solid #333; cursor: pointer; } .grey-gradient { width: 100%; padding: 0 0 80px; background: #4e444e; } .video-slider-container { max-width: 1290px; margin: auto; padding: 1em; } #videoCarouselOne h2, #videoCarouselThree h2, #videoCarouselTwo h2 { font-size: 3.25em; } #videoCarouselOne, #videoCarouselThree, #videoCarouselTwo { position: relative  !important; } #videoCarouselOne .carousel-caption, #videoCarouselThree .carousel-caption, #videoCarouselTwo .carousel-caption { width: 55%  !important; position: relative  !important; right: 0  !important; left: 0  !important; text-align: left  !important; bottom: auto  !important; height: 200px; } #videoCarouselOne .slider-carousel-indicators, #videoCarouselThree .slider-carousel-indicators, #videoCarouselTwo .slider-carousel-indicators { position: absolute; right: 0px  !important; margin: auto  !important; bottom: 50px  !important; display: flex; flex-direction: row; } #videoCarouselOne .slider-carousel-indicators .active, #videoCarouselThree .slider-carousel-indicators .active, #videoCarouselTwo .slider-carousel-indicators .active { color: #46c8e1; } #videoCarouselOne .slider-carousel-indicators .active p, #videoCarouselThree .slider-carousel-indicators .active p, #videoCarouselTwo .slider-carousel-indicators .active p { color: #46c8e1; } #videoCarouselOne .slider-carousel-indicators .active .slider-border, #videoCarouselThree .slider-carousel-indicators .active .slider-border, #videoCarouselTwo .slider-carousel-indicators .active .slider-border { transition: all .3s ease-out 0s; height: 2px; margin: 0 4%; background-color: #46c8e1; bottom: 0; } #videoCarouselOne .slider-carousel-indicators .active .slider-border { left: 25%; } #videoCarouselTwo .slider-carousel-indicators .active .slider-border { left: 50%; } #videoCarouselThree .slider-carousel-indicators .active .slider-border { left: 75%; } #videoCarouselOne .slider-carousel-indicators li, #videoCarouselThree .slider-carousel-indicators li, #videoCarouselTwo .slider-carousel-indicators li { margin: 20px; color: #fff  !important; text-align: center; } #videoCarouselOne .slider-carousel-indicators li:hover, #videoCarouselThree .slider-carousel-indicators li:hover, #videoCarouselTwo .slider-carousel-indicators li:hover { cursor: pointer; color: #46c8e1  !important; } #videoCarouselOne .slider-carousel-indicators [data-bs-target], #videoCarouselThree .slider-carousel-indicators [data-bs-target], #videoCarouselTwo .slider-carousel-indicators [data-bs-target] { box-sizing: border-box  !important; flex: auto  !important; width: 100px  !important; height: 3px; padding: 0; text-indent: 0  !important; } #carouselIndicatorOne .indicatorTab.active .svg-icon, #carouselIndicatorThree .indicatorTab.active .svg-icon, #carouselIndicatorTwo .indicatorTab.active .svg-icon { filter: invert(71%) sepia(46%) saturate(557%) hue-rotate(145deg) brightness(100%) contrast(97%); } .svg-icon { filter: invert(100%) sepia(0) saturate(7500%) hue-rotate(226deg) brightness(103%) contrast(103%); opacity: .6; max-width: none  !important; max-height: none  !important; } .svg-icon:hover { filter: brightness(0) invert(1); filter: invert(71%) sepia(46%) saturate(557%) hue-rotate(145deg) brightness(100%) contrast(97%); } #carouselContentOne .carousel-caption .carousel-controls, #CarouselContentTwo .carousel-caption .carousel-controls, #carouselContentThree .carousel-caption .carousel-controls { width: 100%; height: auto; margin: 12px 0px; display: flex; flex-direction: row; align-items: center; gap: 12px; } @media only screen and (max-width: 768px) { .slider-carousel-indicators { display: none; } #videoCarouselOne .carousel-caption, #videoCarouselThree .carousel-caption, #videoCarouselTwo .carousel-caption { width: 100%  !important; } } @media (min-width: 769px) and (max-width: 1024px) { #videoCarouselOne .carousel-caption, #videoCarouselThree .carousel-caption, #videoCarouselTwo .carousel-caption { width: 65%; height: auto; } #videoCarouselOne .slider-carousel-indicators, #videoCarouselThree .slider-carousel-indicators, #videoCarouselTwo .slider-carousel-indicators { bottom: 170px  !important; } #videoCarouselOne .slider-carousel-indicators [data-bs-target], #videoCarouselThree .slider-carousel-indicators [data-bs-target], #videoCarouselTwo .slider-carousel-indicators [data-bs-target] { width: 70px  !important; } #videoCarouselOne .slider-carousel-indicators li, #videoCarouselThree .slider-carousel-indicators li, #videoCarouselTwo .slider-carousel-indicators li { margin: 10px; } } .cta_container.pc-cta_container .pc-card-cta-wrapper.cta-wrapper .cta-button.cta-button_subseries:hover { color: #294e95; border: 1px solid #294e95; background-color: #eaeef5  !important; } a:focus-visible, .no-opacity:focus-visible, [role="button"]:focus-visible, .indicatorTab.active button:focus-visible { outline: 2px solid white  !important; outline-offset: 2px; border-radius: 2px; } .carousel-control-prev:focus-visible, .carousel-control-next:focus-visible { outline: none  !important; } .carousel-control-prev:focus-visible svg, .carousel-control-next:focus-visible svg { outline: 2px solid #fff; outline-offset: 4px; border-radius: 50%; } @media screen and (min-width: 1920px) { .pcWrap .banner-rectangle-content, .banner-two-rectangle-content { max-width: unset  !important; } } .featured-thinkpad .btn-primary:focus, .shop-now:focus, .js-video-button:focus { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000; } .featured-thinkpad .btn-primary:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000; } .featured-thinkpad .card, .thinkpad-z-logo { overflow: visible  !important; } .featured-thinkpad a:focus img, .cta_container.pc-cta_container .pc-card-cta-wrapper.cta-wrapper .cta-button.cta-button_subseries:focus, .cta_container.pc-cta_container .pc-card-cta-wrapper.cta-wrapper .cta-button:focus .ctaButton_btn_com .ctaButton_btn:focus, .series-thumb:focus { outline: 3px solid #000; outline-offset: 2px; } .ctaButton_btn:focus, .btn-secondary:focus, .cta_button_icon_content span:focus { outline: 2px solid black  !important; outline-offset: 2px  !important; } .pc-card-cta-wrapper .cta-button.product_cta_button:focus, .pc-card-cta-wrapper .cta-button.product_cta_button:focus-visible { outline: none  !important; box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000  !important; position: relative; z-index: 10; transition: box-shadow .1s ease-in-out; } .ctaButton_btn_com.ctaButton_link:focus, .ctaButton_btn_com.ctaButton_link:focus-visible { outline: none  !important; box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000  !important; border-radius: 4px  !important; text-decoration: none  !important; position: relative; z-index: 5; display: inline-block; } .ctaButton_btn_com.ctaButton_link:focus .cta_button_icon_content span { color: #000  !important; font-weight: bold  !important; } a.series-thumb:focus, a.series-thumb:focus-visible { outline: none  !important; box-shadow: 0 0 0 3px #000  !important; border-radius: 4px  !important; display: inline-block; padding: 2px; background-color: #fff; } div.facets-name[role="button"]:focus, div.facets-name[role="button"]:focus-visible { outline: none  !important; box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000  !important; border-radius: 4px  !important; background-color: #f8f9fa  !important; position: relative; z-index: 2; padding: 5px  !important; margin: -5px; }
