.timeline-slider-wrapper{width:100%; overflow:hidden; margin-top: 100px} .timeline-bx-slider{display:none} .bx-wrapper .bx-viewport{left: 0  !important} .bx-wrapper .timeline-bx-slider{display:block; background:url(https://www.lenovo.com/medias/3-heritage-timeline-spacer.png?context=bWFzdGVyfHd3LXRoaW5rLWJyYW5kLWNhbXBhaWduLTIwMTd8MTA3N3xpbWFnZS9wbmd8d3ctdGhpbmstYnJhbmQtY2FtcGFpZ24tMjAxNy9oZDUvaGExLzkzNjQwMjE4Mzc4NTQucG5nfDVkYTYwYzQ5ZjZjZWRjNTczMWQxYWMzMDlkYTE5YTdlNjQ3OWM5NTgzN2UxYTI4NWQ1NTBhYWI4ZDg4NDZmMTc) 50% 98% repeat-x; height: 100%} .time-item{padding-bottom:120px} .time-item-content{width:60%; margin:0 auto} .time-item .ts-image{float:left; width:48%; margin-right:2%} .time-item .ts-image img{float:right} .time-item .ts-content{float:left; width:48%; margin-left:2%} .ts-title{ font-size: 24px; font-weight: bold; line-height: 28px; margin-bottom: 15px; } .ts-text{ } .bx-wrapper{position: relative; margin: 0 auto 0px; padding: 0; *zoom: 1} .bx-wrapper img{max-width: 100%; display: block} .bx-wrapper .bx-viewport{left: -5px; -webkit-transform: translatez(0); -moz-transform: translatez(0); -ms-transform: translatez(0); -o-transform: translatez(0); transform: translatez(0)} .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{position: absolute; bottom: -30px; width: 100%} .bx-wrapper .bx-loading{min-height: 50px; background: url(/medias/2-features-bx-loader.gif?context=bWFzdGVyfHd3LXRoaW5rLWJyYW5kLWNhbXBhaWduLTIwMTd8ODU4MXxpbWFnZS9naWZ8d3ctdGhpbmstYnJhbmQtY2FtcGFpZ24tMjAxNy9oZDIvaGNkLzkzNjQwMjAwNjgzODIuZ2lmfDlmNjY2NDI4MGFiYzQ0MDY0NDBhMmRmZmEzNzQ0ZTIyMTZhYjQwMDEzZmI2Y2ExNTAyODhhNGFjMjIzMDIxZTg ) center center no-repeat #fff; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 2000} .bx-controls{display:none} .timeline-bx-pager{float:left; width:100%; overflow:hidden; position:relative; margin:40px 0 40px} .timeline-bx-pager ul{clear:left; float:left; list-style:none; margin:0; padding:0; position:relative; left:50%; text-align:center} .timeline-bx-pager ul li{display:block; float:left; list-style:none; margin:0; padding:0; position:relative; right:50%} .timeline-bx-pager ul li a{text-decoration:none; padding:10px 5px 50px; float:left} .timeline-bx-pager ul li a .tlp-date{ opacity:0; color:#999; font-size: 18px; font-weight: bold; } .timeline-bx-pager ul li a:hover .tlp-date{opacity:1; color:#6ec8e1} .timeline-bx-pager ul li a.active .tlp-date{opacity:1; color: #e2231a} .timeline-bx-pager ul li a:after{content:''; width:26px; height:26px; background:#999; -moz-border-radius:13px; -webkit-border-radius:13px; border-radius:13px; position:absolute; top:40px; left:50%; margin-left:-13px} .timeline-bx-pager ul li a:hover:after{background:#6ec8e1} .timeline-bx-pager ul li a.active:after{background:#eb150b} .timeline-slider-wrapper.timeline-blue .timeline-bx-pager ul li a:hover .tlp-date{color:#b6cede} .timeline-slider-wrapper.timeline-blue .timeline-bx-pager ul li a.active .tlp-date{color: #0d5c91} .timeline-slider-wrapper.timeline-blue .timeline-bx-pager ul li a:after{background:#b6cede} .timeline-slider-wrapper.timeline-blue .timeline-bx-pager ul li a:hover:after{background:#b6cede} .timeline-slider-wrapper.timeline-blue .timeline-bx-pager ul li a.active:after{background:#0d5c91} .timeline-slider-wrapper.timeline-blue .bx-wrapper .timeline-bx-slider{background-image: url("data:image/svg+xml,%3Csvgxmlns='http://www.w3.org/2000/svg'xmlns:se='http://svg-edit.googlecode.com'xmlns:xlink='http://www.w3.org/1999/xlink'xmlns:dc='http://purl.org/dc/elements/1.1/'xmlns:cc='http://creativecommons.org/ns%23'xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape'width='52'height='52'%3E%3Crectid='backgroundrect'width='100%25'height='100%25'x='0'y='0'fill='none'stroke='none'/%3E%3Cgclass='currentLayer'style=''%3E%3Cpathfill='%234a90d6'fill-opacity='1'stroke='%23B6CEDE'stroke-opacity='1'stroke-width='2'stroke-dasharray='none'stroke-linejoin='round'stroke-linecap='butt'stroke-dashoffset=''fill-rule='nonzero'opacity='1'marker-start=''marker-mid=''marker-end=''d='M25,10L25,32'id='svg_1'/%3E%3C/g%3E%3C/svg%3E")} .timeline-slider-wrapper.timeline-green .timeline-bx-pager ul li a:hover .tlp-date{color:#c1d2b9} .timeline-slider-wrapper.timeline-green .timeline-bx-pager ul li a.active .tlp-date{color: #427c27} .timeline-slider-wrapper.timeline-green .timeline-bx-pager ul li a:after{background:#c1d2b9} .timeline-slider-wrapper.timeline-green .timeline-bx-pager ul li a:hover:after{background:#c1d2b9} .timeline-slider-wrapper.timeline-green .timeline-bx-pager ul li a.active:after{background:#427c27} .timeline-slider-wrapper.timeline-green .bx-wrapper .timeline-bx-slider{background-image: url("data:image/svg+xml,%3Csvgxmlns='http://www.w3.org/2000/svg'xmlns:se='http://svg-edit.googlecode.com'xmlns:xlink='http://www.w3.org/1999/xlink'xmlns:dc='http://purl.org/dc/elements/1.1/'xmlns:cc='http://creativecommons.org/ns%23'xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape'width='52'height='52'%3E%3Crectid='backgroundrect'width='100%25'height='100%25'x='0'y='0'fill='none'stroke='none'/%3E%3Cgclass='currentLayer'style=''%3E%3Cpathfill='%234a90d6'fill-opacity='1'stroke='%23C1D2B9'stroke-opacity='1'stroke-width='2'stroke-dasharray='none'stroke-linejoin='round'stroke-linecap='butt'stroke-dashoffset=''fill-rule='nonzero'opacity='1'marker-start=''marker-mid=''marker-end=''d='M25,10L25,32'id='svg_1'/%3E%3C/g%3E%3C/svg%3E")} @media screen and (max-width: 1024px) { .timeline-intro .ti-pretitle{ font-size: 1.125em; } .timeline-intro .ti-title{ font-size: 1.125em; } .timeline-intro .ti-text{ font-size: 1em; } .ts-content{ -webkit-text-size-adjust: 100%; } .ts-pretitle{ font-size: 1.125em; } .ts-title{ font-size: 1.5em; } .ts-text{ font-size: 1em; } .time-item-content{ width: calc(100% - 120px); } .timeline-bx-pager { overflow: visible; margin: 0; } .timeline-bx-pager ul li a .tlp-date{ display:none; } .timeline-bx-pager ul li a { margin:0 5px; } .timeline-bx-pager ul li a:after { width: 10px; height: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-left:-5px; margin-top:-20px; } .bx-controls { display: block; } a.bx-prev, a.bx-next{ position:absolute; top:170px; text-indent:-9999px; font-size:0; width:20px; height:40px; opacity: .2; } a.bx-prev.disabled, a.bx-next.disabled{ display:none; } a.bx-prev{ left:10px; background:url(/medias/3-heritage-arrow-left-black.png?context=bWFzdGVyfHd3LXRoaW5rLWJyYW5kLWNhbXBhaWduLTIwMTd8MjI1fGltYWdlL3BuZ3x3dy10aGluay1icmFuZC1jYW1wYWlnbi0yMDE3L2g3My9oY2MvOTM2NDAyMTcwNjc4Mi5wbmd8NGU2Yzg5ODM0MGQ4Mjc5N2Y5ZmMwNDFjMjY5NzM5NzI0OTEyNTY5ZmRjZWRkYTFmZjQ5YzliMjc0YTBkOWE5Mg) 0 0 no-repeat; background-size:contain; } a.bx-next{ right:10px; background:url(/medias/3-heritage-arrow-right-black.png?context=bWFzdGVyfHd3LXRoaW5rLWJyYW5kLWNhbXBhaWduLTIwMTd8MjI2fGltYWdlL3BuZ3x3dy10aGluay1icmFuZC1jYW1wYWlnbi0yMDE3L2g0NC9oMTUvOTM2NDAyMTc3MjMxOC5wbmd8YWYyMzYxZmVjNDQyNjM3ZTEyNzc0MTFjYjk3YmI3MzI2MDFhYmFhMjc0Y2UzYjUwZmIzNjlmZWNjYzc0MjI0Yg) 0 0 no-repeat; background-size:contain; } } @media only screen and (max-width: 768px) { .bx-wrapper .container{max-width: calc(100% - 80px)  !important} } @media only screen and (max-width: 639px) { .time-item .ts-image{width: 100%; margin: 0 0 20px} .time-item .ts-image img{float: none; margin: 0 auto} .time-item .ts-content{width: 100%; margin: 0} .timeline-intro .ti-pretitle{ font-size: 1.125em; } .timeline-intro .ti-title{ font-size: 1.125em; font-family: "Lato-Regular"; } .timeline-intro .ti-text{ font-size: 1.125em; } .ts-pretitle{ font-size: 1.125em; } .ts-title{ font-size: 1.5em; } .ts-text{ font-size: 1.125em; } .timeline-bx-pager ul li a .tlp-date{ font-size: 1.125em; } .time-item .ts-image{ width:80%; float:none; margin:0 auto 20px; text-align:center; } .time-item .ts-image img { float: none; margin:0 auto; max-width:80%; } .time-item .ts-content{ width:100%; float:none; margin:0 auto; text-align: center; } } @media screen and (max-width: 320px) { .timeline-intro .ti-text {font-size:1em} .ts-pretitle {font-size: 1em} .ts-title {font-size: 1.25em} .ts-text {font-size: 1em} } .timeline-slider-wrapper.style-2 .bx-wrapper .timeline-bx-slider{background: none} .timeline-slider-wrapper.style-2 .timeline-bx-pager{padding-bottom: 40px} .timeline-slider-wrapper.style-2 .timeline-bx-pager ul li a{width: 25px; margin: 0 15px} .timeline-slider-wrapper.style-2 .timeline-bx-pager ul li a .tlp-date{position: absolute; left: -72.5px; width: 200px}