@media screen and (min-width:600px){.topbannerm{ display:none; }} @media screen and (max-width:600px){ .m-espotRedesign__title{display:none} .topbannerd{ display:none; }} .heroContainer{display:none} .skinny-banner{text-align:center} .hero-banner .desktop, .skinny-banner .desktop{display:inline-block} .hero-banner .mobile, .skinny-banner .mobile{display: none} h2{font-size: 2em; text-align: center; font-weight: 700; line-height:1.2em; margin-top:.8em} #three-product-grouper article>a { display: none  !important } #three-product-grouper { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; padding-bottom:1em; } #three-product-grouper article { width: 50%; max-width: 559px; height: 350px; position: relative; margin-top: 30px; background-size: cover; background-repeat: no-repeat; background-position: center center; border: none; border-radius: 0; background-position:center center; } #three-product-grouper article:first-child {background-image: url("//static.lenovo.com/id/in/merch/XMas-NY-22/espot/X-Mas_NY_Generic_DD_E-Spot.jpg?R")} #three-product-grouper article:nth-child(2) {background-image: url("//static.lenovo.com/id/in/merch/amazing_autumn/Amazing_Autumn_24_HR_Delivery_DD_E-Spot.jpg?r")} #three-product-grouper article:nth-child(3) {background-image: url("https://static.lenovo.com/id/in/1-chrome/Unidays_DD_E-Spot.jpg?S")} #three-product-grouper article:nth-child(4) {background-image: url("https://static.lenovo.com/id/in/merch/intel-cod/Next_Gen_Intel_COD_DD_E-Spot.jpg?r")} #three-product-grouper article:nth-child(5) {background-image: url("https://static.lenovo.com/id/in/offers-revamp/Workstation%20Deals.jpg")} #three-product-grouper article:nth-child(6) {background-image: url("https://static.lenovo.com/id/in/offers-revamp/Desktop%20Deals.jpg")} #three-product-grouper article:nth-child(7) {background-image: url("https://static.lenovo.com/id/in/offers-revamp/Accessories%20Deals.jpg")} #three-product-grouper article:nth-child(8) {background-image: url("https://static.lenovo.com/au/image/2021/Headphones_banner-78023229.jpg")} #three-product-grouper.webcam article:first-child { background-image: url("//static.lenovo.com/id/in/offers-revamp1/Ultra-slim_laptop_deals.jpg"); } #three-product-grouper.webcam article:nth-child(2) { background-image: url("//static.lenovo.com/id/in/offers-revamp/Gaming%20PC%20Deals.jpg"); } #three-product-grouper.webcam article:nth-child(3) { background-image: url("https://static.lenovo.com/id/in/offers-revamp1/Ultra-slim_laptop_deals.jpg"); } #three-product-grouper.webcam article:nth-child(4) { background-image: url("https://static.lenovo.com/id/in/offers-revamp/Business%20Deals.jpg"); } #three-product-grouper.processors article:first-child { background-image: url("//static.lenovo.com/id/in/offers-revamp1/Intel_Core_i3_Deals.jpg"); } #three-product-grouper.processors article:nth-child(2) { background-image: url("//static.lenovo.com/id/in/offers-revamp1/Intel_Core_i5_Deals.jpg"); } #three-product-grouper.processors article:nth-child(3) { background-image: url("//static.lenovo.com/id/in/offers-revamp1/Intel_Core_i7_Deals.jpg"); } #three-product-grouper.processors article:nth-child(4) { background-image: url("https://static.lenovo.com/id/in/offers-revamp1/AMD-Deals.jpg?s"); } #three-product-grouper.audio article:first-child { background-image: url("https://static.lenovo.com/id/in/offers-revamp/Audio.jpg"); } #three-product-grouper.audio article:nth-child(2) { background-image: url("https://static.lenovo.com/id/in/offers-revamp/Webcam%20&%20Video.jpg"); } #three-product-grouper.audio article:nth-child(3) { background-image: url("https://static.lenovo.com/id/in/offers-revamp/Keyboard%20&%20Mice.jpg"); } #three-product-grouper.audio article:nth-child(4) { background-image: url("//static.lenovo.com/au/image/2021/SPEAKERPHONES_banner-78020887.jpg"); } #three-product-grouper.furniture article:first-child { background-image: url("//static.lenovo.com/id/in/offers-revamp/Gaming%20Accessories.jpg"); } #three-product-grouper.furniture article:nth-child(2) { background-image: url("//static.lenovo.com/au/image/2021/desk_banner-78019569.jpg"); } #three-product-grouper.memory, #three-product-grouper.audio, #three-product-grouper.furniture{justify-content: space-evenly} #three-product-grouper article .product-description { background: rgba(0, 0, 0, .7); width: 100%; position: absolute; bottom: 0; left: 0; padding: 10px 0; display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; text-align: center; } #three-product-grouper article h2 { color: #3e8ddd; font-size: 38px; font-weight: bold; text-transform: uppercase; } #three-product-grouper article p { color: white; font-size: 16px; margin: 5px auto; padding: 0px 5px; } #three-product-grouper article a { color: white; font-size: 16px; font-weight: bold; background: #1976a1; border-radius: 4px; padding: 0 20px; height: 34px; line-height: 34px; } .msaMastheadPage .body-inner-wrapper header .bar_2 { display: none  !important; } .pageWrapper { width: 100%  !important; } .m-mastheadSubNav__list>li>a { display: inline-block; padding: .7em 0 .1em 0; } .m-mastheadUtilityLinks__list.clearfix li { line-height: 30px  !important; } .heightHelper { display: none; } .m-affinitySiteBar { line-height: 1.75 } html { overflow-x: hidden; } body { line-height: unset  !important; color: #000; font-family: 'Lato'; margin: 0; overflow-x: hidden; } section { margin: auto; width: 100%; max-width: 1920px; } section a { text-decoration: none; text-transform: uppercase; } .btn { transition: all .25s ease-out } .btn:hover { box-shadow: 0px 0 8px 3px rgba(0, 0, 0, .15); } .desktop{ display: none; } @media (max-width:749px) and (min-width:100px) { .hero-banner .desktop, .skinny-banner .desktop{display: none} .hero-banner .mobile, .skinny-banner .mobile{display: block} #three-product-grouper article>a { display: block; } #three-product-grouper { width: 90%; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 15px; } #three-product-grouper article { width: 100%; max-width: 100%; height: 170px; position: relative; margin-top: 5px; border: 3px solid #e4e4e4; border-radius: 10px; } #three-product-grouper article .product-description { } #three-product-grouper article h2 { color: ##3e8ddd; font-size: 20px; text-transform: capitalize; text-align: center; margin-top:0; } #three-product-grouper article p { color: white; font-size: 18px; margin: 5px auto; } #three-product-grouper article a { padding: 0 18px; height: 100%; display: flex; flex-direction: column; justify-content: space-evenly; font-weight: normal; line-height: 34px; } #three-product-grouper article a img{ height: 60px; } .brands-logo-container { width:20%  !important; margin:0 10px 50px  !important; } } @media (min-width: 750px) { #dots{ display: none; } #big-espots div { width: 100%; } .product-description { display: none; } #three-product-grouper { width: 92%; display: flex; flex-wrap: wrap; justify-content: space-between; } #three-product-grouper article { margin-top: 30px; box-sizing: border-box; height: 260px; min-width: 225px; width: 33%; border: 2px solid #e3e3e3; border-radius: 4px; background-color: transparent; } #three-product-grouper article>a { height: 100%; width: 100%; box-sizing: border-box; text-align: center; display: flex; align-content: center; justify-content: space-around; flex-direction: column; } #three-product-grouper article>a h2{ color: #777; font-size: 18px; letter-spacing: 0; line-height: 20px; text-align: center; } #three-product-grouper article>a img, #three-product-grouper article>a svg{ height: 60px; margin: 0 auto; } #three-product-grouper article h2 { color: ##3e8ddd; font-size: 18px; text-transform: capitalize; text-align: center; margin-top:0; } } @media (min-width: 1180px) { .mobile{ display: none; } .desktop{ display: block; } #hero-hos { height: 445px; background: url("//static.lenovo.com/na/landing-pages/work-from-home-category/hero-banner-1180.jpg") center center no-repeat; background-size: cover; } .hero-description { background: #3e8ddd; color: white; height: 100%; width: 42%; display: flex; flex-direction: column; justify-content: center; align-items: center; } .hero-description div { width: 80%; } .hero-description div h2 { font-size: 43px; font-weight: bold; margin-bottom: 37px; width: 298px; line-height: 1; color: white } .hero-description div h3 { font-size: 22px; font-weight: bold; line-height: 22px; margin-bottom: 22px; color: white } .hero-description div p { font-size: 18px; line-height: 22px; } #three-product-grouper article>a { display: none  !important } #three-product-grouper { width: 100%; display: flex; flex-wrap: wrap; justify-content:space-evenly; padding-bottom:1em; } #three-product-grouper article { width: 24%; max-width: 559px; height: 300px; position: relative; margin-top: 30px; background-size: cover; background-repeat: no-repeat; background-position: center center; border: none; border-radius: 0; } #three-product-grouper.memory, #three-product-grouper.audio, #three-product-grouper.furniture{justify-content: space-evenly} #three-product-grouper article .product-description { Height: 189px; background: rgba(0, 0, 0, .7); width: 100%; position: absolute; bottom: 0; left: 0; padding: 10px 0; display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; text-align: center; } #three-product-grouper article h2 { color: #3e8ddd; font-size: 24px; font-weight: bold; } #three-product-grouper article p { color: white; font-size: 16px; margin: 5px auto; } #three-product-grouper article a { color: white; font-size: 16px; font-weight: bold; background: #1976a1; border-radius: 4px; padding: 0 24px; height: 44px; line-height: 44px; } } @media (min-width: 1920px) { #hero-hos { background: url("//static.lenovo.com/na/landing-pages/work-from-home-category/hero-banner-1920.jpg") center center no-repeat; background-size: cover; } .hero-description { width: 30%; } #bottom-cta-banner p { width: auto; } } #brands, #categories { text-align: center; padding: 20px 10px 0 } .brands-container { font-size: 0; padding: 40px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap } .brands-logo-container { width:10%; display: inline-block; margin:0 20px 50px } .brands-lenovo, .brands-logitech { text-align: left } .brands-lenovo img, .brands-lenovo svg, .brands-logitech img, .brands-logitech svg { width: 80px } .brands-microsoft { text-align: right } .brands-microsoft img, .brands-microsoft svg { width: 85px } .brands-thinkpad img, .brands-thinkpad svg { width: 70px } .brands-adobe img, .brands-adobe svg { width: 35px; display: inline-block; margin-left: -20% } .brands-jabra img, .brands-jabra svg { width: 95px } .brands-xbox img, .brands-xbox svg { width: 78px; display: inline-block; margin-left: 20%; margin-top: -3px } .brands-fitbit img, .brands-fitbit svg { width: 92px } .brands-all { margin-bottom: 0; text-align: center } .brands-all a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .brands-all a span { font-size: 13px; color: #000; font-weight: 700; display: inline-block; margin-left: 4px } .brands-all a:hover svg #circle-add { fill: #1976a1 } .brands-all a:hover span { color: #1976a1 } .brands-all img, .brands-all svg { width: 17px } .brands-all img #circle-add, .brands-all svg #circle-add { fill: #000 } @media screen and (min-width: 700px) { #brands>div>div.brands-logo-container.brands-xbox { width: 8%; } #brands>div>div.brands-logo-container.brands-xbox>a>img { width: 100%; } } @media screen and (max-width: 699px) { #brands>div>div.brands-logo-container.brands-xbox { width: 20%; } #brands>div>div.brands-logo-container.brands-xbox>a>img { width: 100%; } h2{font-size: 1em} } @media (min-width:1280px) { .brands-container { padding: 40px 10px; } .brands-logo-container { text-align: left } .brands-lenovo { width: 130px } .brands-microsoft { width: 160px } .brands-thinkpad { width: 142px } .brands-adobe { width: 75px } .brands-jabra { width: 130px } .brands-xbox { width: 44px } .brands-logitech { width: 135px } .brands-fitbit { width: 130px } .brands-all a { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .brands-all a span { font-size: 20px } .brands-all { width: 128px } .brands-all img, .brands-all svg { width: 23px } } @media (min-width:1360px) { .categories-container { padding: 30px 0 10px } .categories-element { max-width: 227px; margin-right: 30px } #espots .espot-slide:nth-of-type(3) .espot-img-container { background-position-x: 100% } } @media (min-width:1765px) { .main-content .section-container { margin: auto } } .rich-text{padding:0 !important;background:none  !important} .rich-text .legal-detail{margin:0 !important;margin-bottom:0px !important} .smallEspot-wrapper { width:100%; background-color:#f4f4f4; color:#000; text-align:center; overflow:hidden } .smallEspot-wrapper .smallEspot-title { line-height:25px } .smallEspot-wrapper .smallEspot-category { display:flex; justify-content:center; align-content:center; flex-wrap:wrap } .smallEspot-wrapper .smallEspot-category .smallEspot-item { text-align:center; padding:0 26px 0 } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-link { color:#000 } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-link .smallEspot-image { border-radius:50% } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-link .smallEspot-name { font-size:16px; line-height:19px; word-wrap:break-word; max-width:100% } @media print, screen and (max-width: 73.74875em) { .smallEspot-wrapper .smallEspot-title { font-size:16px; line-height:19px } .smallEspot-wrapper .smallEspot-category { padding:10px 0 12px } .smallEspot-wrapper .smallEspot-category .smallEspot-item { width:33%; padding:0 18px 0 } } @media screen and (max-width: 73.74875em) and (max-width: 320px) { .smallEspot-wrapper .smallEspot-category .smallEspot-item { padding:0 } } @media print, screen and (max-width: 73.74875em) { .smallEspot-wrapper .smallEspot-category .smallEspot-item:nth-child(1) { padding-left:15px } .smallEspot-wrapper .smallEspot-category .smallEspot-item:nth-child(3) { padding:0 } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-image { width:85px; height:85px; margin-bottom:8px } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-name { font-size:12px; line-height:15px } } @media print, screen and (min-width: 46.875em) { .smallEspot-wrapper .smallEspot-title { font-size:21px  !important; font-weight:normal  !important; line-height:25px } .smallEspot-wrapper .smallEspot-category { padding:10px 0 6px } .smallEspot-wrapper .smallEspot-category .smallEspot-item { width:25% } } @media screen and (min-width: 46.875em) and (max-width: 119.99875em) { .smallEspot-wrapper .smallEspot-category .smallEspot-item:nth-child(5) { display:none } } @media print, screen and (min-width: 46.875em) { .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-image { width:130px; height:130px; margin-bottom:15px } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-name { font-size:16px; line-height:19px } } @media screen and (min-width: 80em) { .smallEspot-wrapper .smallEspot-title { max-width:1280px; margin:.5em auto  !important; } .smallEspot-wrapper .smallEspot-category { padding:21px 0 12px; max-width:1280px; margin:0 auto } } @media screen and (min-width: 80em) and (min-width: 1280px) { .smallEspot-wrapper .smallEspot-category { padding:21px 17px 12px } } @media screen and (min-width: 80em) { .smallEspot-wrapper .smallEspot-category .smallEspot-item { width:20% } .smallEspot-wrapper .smallEspot-category .smallEspot-item:nth-child(5) { display:block } .smallEspot-wrapper .smallEspot-category .smallEspot-item .smallEspot-image { width:160px; height:160px } } .top_selling { padding: 0px  !important; } #group-get-sheerid-verify { display: block  !important; } .m-categoryBar { display: none; } .l-section { margin: 30px auto; width: 100%; max-width: 1440px; position: relative; } .l-section h3 { margin: 0; margin-bottom: 20px; padding-left: 5px; font-size: 32px  !important; letter-spacing: 0; font-weight: normal  !important; color: #000  !important; text-align: left; } .l-panel::after, .l-row::after { content: ""; display: table; clear: both; } .l-thumb img, .l-background img { width: 100%; height: auto; display: inline-block; } img.icon-desktop { display: inline-block; } img.icon-mobile { display: none; } .l-cta { background: #fff; margin: 0 auto; border: 1px solid #6ac346; border-radius: 3px; padding: 12px; width: 140px; line-height: 16px; font-size: 16px; font-weight: 700; letter-spacing: 0; text-align: center; box-shadow: none; color: #6ac346; text-align: center; cursor: pointer; text-transform: uppercase; transition: all .2s linear; } .l-cta:hover { background-color: #6ac346; color: #fff !important; box-shadow: none; } .l-section.extra-banner-text { background: rgba(0, 0, 0, .85); margin-top: 0px; margin-bottom: 0; width: 100%; max-width: initial; min-height: 126px; position: relative; z-index: 1; } .extra-banner-text .l-row { margin: 0 auto; padding: 20px 10px 18px 10px; max-width: 1440px; display: flex; } .extra-banner-text .l-item { flex: 1; } .extra-banner-text .l-thumb { margin: 15px 40px; width: 60px; height: 60px; float: left; } .extra-banner-text .l-information { width: calc(100% - 141px); float: left; } .extra-banner-text .l-title { min-height: 42px; line-height: 21px; font-size: 18px; letter-spacing: 0; font-weight: normal; color: #fff; margin-bottom: 10px; } .extra-banner-text .l-subtitle { min-height: 36px; line-height: 17px; font-size: 14px; letter-spacing: 0; font-weight: normal; color: #fff; white-space: normal; text-overflow: ellipsis; overflow: hidden; } .extra-banner-text .l-link { height: auto; line-height: 18px; font-size: 14px; letter-spacing: 0; font-weight: bold; color: #6ac346; margin-right: 10px; display: inline; float: left; cursor: pointer; } .extra-banner-text .l-link:hover { text-decoration: underline; } .l-section.slogan { background: #f4f4f4; margin-top: 0; padding: 10px 0; width: 100%; max-width: initial; line-height: 32px; font-size: 16px; font-weight: 600; text-align: center; color: #000; } .shop-by-gear .l-item { background: #f8f8f8; margin: 5px; border: 1px solid #aaa; border-radius: 5px; width: calc(20% - 12px); display: inline-block; } .shop-by-gear .l-item:hover { box-shadow: 0 8px 10px 0 rgb(84 84 84 / 32%); } .shop-by-gear .l-thumb { margin: 20px auto 0 auto; width: 60px; height: 60px; text-align: center; } .shop-by-gear .l-text { padding: 15px; height: 60px; line-height: 1; font-size: 18px; letter-spacing: 0; color: #000; text-align: center; vertical-align: middle; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; } .shop-by-gear .l-item:nth-child(1) .l-text { line-height: 1; white-space: pre-wrap; } .shop-by-gear .l-panel { text-align: center; } .shop-on-point .l-panel { display: block; text-align: center; } .shop-on-point .l-item { background: #f8f8f8; margin: 5px; border-radius: 9px; width: calc(25% - 14px); position: relative; overflow: hidden; display: inline-block; } .shop-on-point .l-background { width: 100%; overflow: hidden; } .shop-on-point .l-information { background: rgba(0, 0, 0, .65); width: 100%; height: 110px; position: absolute; left: 0; bottom: 0; text-align: center; color: #fff; } .shop-on-point .l-thumb { margin: 15px auto 5px auto; width: 50px; height: 50px; } .shop-on-point .l-text { padding: 0 10px; height: 3em; max-height: 3em; line-height: 1em; display: none; } .shop-on-point .l-title { padding: 0 10px; } .shop-on-point .l-item:hover .l-information { background: rgba(0, 0, 0, .85); height: 150px; } .shop-on-point .l-item:hover .l-text { display: block; } .shop-hot-products .l-item { background-color: #e6f4fa; margin: 5px; padding: 30px 6px; width: calc(20% - 10px); box-sizing: border-box; float: left; } .shop-hot-products .l-thumb { background: #fff; margin: 0 auto; border-radius: 50%; width: 195px; height: 195px; box-sizing: border-box; position: relative; } .shop-hot-products .l-title { padding: 6px 10px; height: 44px; line-height: 32px; font-size: 16px; letter-spacing: 0px; font-weight: 900; color: #000; text-align: center; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .shop-hot-products .l-recommend-text { padding: 0 10px; height: 60px; line-height: 20px; font-size: 14px; letter-spacing: 0; color: #000; text-align: center; overflow: hidden; } .shop-hot-products .l-price-saved { margin-top: 15px; height: 20px; line-height: 20px; font-size: 14px; letter-spacing: 0; color: #545454; text-align: center; } .shop-hot-products .l-price { margin-top: 15px; height: 30px; line-height: 20px; font-size: 16px; letter-spacing: 0; font-weight: 900; color: #000; text-align: center; overflow: hidden; } .shop-hot-products .l-item:hover { box-shadow: 0 7px 10px #ccc; } .shop-hot-products .l-item:hover .l-cta { background-color: #6ac346; color: #fff !important; box-shadow: none; font-weight: normal; } .l-section.shop-for-community { overflow: hidden; } .shop-for-community h3 { line-height: 1; float: left; } .shop-for-community h3 span { line-height: 1; font-size: 14px; font-weight: normal; } .shop-for-community h3 p { margin-bottom: 0; } .shop-for-community h3 p #community-courses { display: none; } .shop-for-community .l-cta-group { float: right; } .shop-for-community .l-cta-explore { margin-top: 15px; width: auto; float: left; } .shop-for-community .l-trigger { width: 13px; position: absolute; top: 60%; cursor: pointer; z-index: 100; } .shop-for-community .l-trigger.l-trigger-left { left: 10px; } .shop-for-community .l-trigger.l-trigger-right { right: 10px; transform: rotate( 180deg); } .shop-for-community .l-carousel-dotted { width: 100%; height: 21px; text-align: center; position: absolute; bottom: 0; } .shop-for-community .l-dotted { margin: 3px; width: 15px; height: 15px; border-radius: 50%; background: #fff; border: 1px solid #444; display: inline-block; cursor: pointer; } .shop-for-community .l-dotted.l-active { background: #444; } .shop-for-community .l-panel:last-child { margin: 20px 0; padding: 0 30px; width: 100%; height: 178px; box-sizing: border-box; position: relative; } .shop-for-community .l-row { width: 200%; height: 182px; position: absolute; white-space: nowrap; transition: left 1s; } .shop-for-community .l-item { margin: 5px; border-radius: 5px; width: calc(12.5% - 28px); height: 168px; display: inline-block; position: relative; overflow: hidden; } .shop-for-community .l-item:nth-child(4) { margin-right: 95px; } .shop-for-community .l-background { position: absolute; width: 100%; height: 100%; } .shop-for-community .l-background img { height: 100%; } .shop-for-community .l-information { background: rgba(0, 0, 0, .65); width: 100%; height: auto; position: absolute; z-index: 99; } .shop-for-community .l-item:hover .l-information { background-color: rgba(0, 0, 0, 1); } .shop-for-community .l-subtitle { margin: 20px 10px 0 10px; font-size: 14px; text-align: center; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .shop-for-community .l-title { width: 100%; min-height: 127px; padding: 5px; line-height: 1.2; font-size: 24px; font-weight: 500; color: #fff; text-align: center; white-space: pre-line; } .shop-benefits .l-panel, .shop-resources .l-panel { display: block; text-align: center; width: auto; margin: 0 auto; } .shop-benefits .l-item, .shop-resources .l-item { background: #f8f8f8; margin: 5px; border: 1px solid #aaa; border-radius: 4px; padding: 6px; width: calc(20% - 14px); box-sizing: border-box; display: inline-block; vertical-align: top; } .shop-benefits .l-item:nth-child(1) .l-title { line-height: 1; } .shop-benefits .l-item:hover, .shop-resources .l-item:hover { box-shadow: 0 5px 10px #aaa; } .shop-benefits .l-thumb, .shop-resources .l-thumb { margin: 14px auto; width: 56px; height: 56px; } .shop-resources .l-text { padding: 0 10px; height: 60px; line-height: 20px; font-size: 16px; letter-spacing: 0; color: #555; text-align: center; overflow: hidden; } .shop-benefits .l-panel:first-child { margin-bottom: 15px; } .shop-benefits h3 { float: left; } .shop-benefits .l-cta-group { float: right; } .shop-benefits .l-title { padding: 8px 10px 0 10px; height: 44px; line-height: 2; font-size: 18px; letter-spacing: 0; text-align: center; color: #555; box-sizing: border-box; overflow: hidden; } .shop-benefits .l-text { margin: 0 auto; padding: 0 10px 10px 10px; height: 72px; line-height: 18px; font-size: 14px; letter-spacing: 0; text-align: center; color: #555; overflow: hidden; } .shop-benefits .l-cta.l-cta-register { width: auto; float: left; margin-right: 10px; } .shop-benefits .l-cta.l-cta-login { float: left; margin-right: 15px; } @media screen and (max-width: 750px) { img.icon-deskpop { display: none; } img.icon-mobile { display: inline-block; } .l-panel::after, .l-row::after { content: ""; display: table; clear: both; } .l-section { padding: 0 10px; width: 100%; min-width: 360px; box-sizing: border-box; overflow: hidden; } .l-section h3 { line-height: 27px; font-size: 22px !important; letter-spacing: 0; } .l-panel { margin: 15px 0; position: relative; } .l-section.extra-banner-text { background: transparent; margin-top: 0; padding: 10px; height: auto; position: static; } .extra-banner-text .l-row { padding: 0; width: 100%; } .extra-banner-text .l-item { background-color: #f8f8f8; margin: 5px; border: 1px solid #bcbcbc; border-radius: 6px; padding: 7px; box-sizing: border-box; width: 50%; min-width: 160px; float: left; } .extra-banner-text .l-thumb { margin: 10px auto; width: 60px; height: 60px; float: none; } .extra-banner-text .l-information { width: 100%; border-right: 0 !important; } .extra-banner-text .l-title { min-height: 135px; line-height: 20px; color: #555; font-size: 12px; letter-spacing: 0; text-align: center; font-weight: normal; } .extra-banner-text .l-subtitle { display: none; } .extra-banner-text .l-links-container { display: flex; justify-content: center; } .extra-banner-text .l-link { color: #6ac346; font-family: Lato; font-size: 13px  !important; font-weight: bold; letter-spacing: 0; line-height: 16px; text-align: center; margin: 10px 0; text-align: center; display: block; margin: 0px 10px 0px 10px; } .extra-banner-text .l-link::after { content: ">"; margin-left: 4px; } .l-section.slogan { display: none; } .shop-by-gear .l-panel { display: flex; overflow-x: scroll; } .shop-by-gear .l-item { min-width: 100px; min-height: 120px; } .shop-by-gear .l-thumb { width: 40px; height: 40px; } .shop-by-gear .l-text { padding: 5px; height: auto; line-height: 18px; font-size: 16px; letter-spacing: 0; white-space: pre-wrap; } .l-section.shop-for-community { margin-bottom: 40px; padding-bottom: 40px; overflow: visible; } .shop-for-community h3 p { display: none; } .shop-for-community .l-panel:first-child { position: static; } .shop-for-community .l-panel:last-child { padding: 0; height: 158px; overflow-x: scroll; } .shop-for-community .l-row { height: 150px; } .shop-for-community .l-cta-group { position: absolute; top: 100%; left: 50%; margin-top: -57px; margin-left: -75px; } .shop-for-community .l-carousel-trigger { display: none; } .shop-for-community .l-carousel-dotted { display: none; } .shop-for-community .l-item { width: 200px; height: 120px; } .shop-for-community .l-item:nth-child(4) { margin-right: 5px; } .shop-for-community .l-information { width: 100%; height: 100%; } .shop-for-community .l-subtitle { margin: 5px 10px 0 10px; } .shop-for-community .l-title { font-size: 18px; min-height: 92px; } .shop-benefits .l-item, .shop-resources .l-item { width: calc(50% - 14px); padding: 0; float: left; } .shop-benefits .l-thumb, .shop-resources .l-thumb { width: 40px  !important; height: 40px  !important; margin: 12px auto; } .shop-benefits .l-text { display: none; } .shop-benefits .l-title { padding: 0 10px; height: 50px; line-height: 20px; font-size: 16px; letter-spacing: 0; text-align: center; } .shop-benefits .l-item:nth-child(2) .l-thumb { height: 30px  !important; margin-top: 24px  !important; } .shop-resources .l-item:nth-child(2) .l-thumb { height: 30px  !important; margin-top: 24px  !important; } .shop-benefits .l-item:nth-child(1) .l-title, .shop-benefits .l-item:nth-child(3) .l-title { line-height: 1; } .shop-resources .l-text { height: 97px; } .shop-benefits .l-cta-group { width: 100%; position: absolute; top: 425px; } .shop-benefits .l-cta { margin: 10px auto  !important; width: 80%  !important; float: none  !important; display: block; } .slick-next.slick-arrow { display: none; } } @media print, screen and (min-width: 750px) and (max-width: 1024px) { .l-section { width: auto; min-width: 750px; overflow: hidden; } .l-section h3 { line-height: 27px; font-size: 22px !important; color: #000 !important; } .l-section.extra-banner-text { margin: 0; width: 100%; height: auto; position: static; } .extra-banner-text .l-row { padding: 0; width: 100%; box-sizing: border-box; } .extra-banner-text .l-item { width: 50%; flex: unset; } .extra-banner-text .l-item:not(:last-child) { border-right: 1px solid #fff; } .extra-banner-text .l-thumb { margin: 15px auto 5px auto; float: none; } .extra-banner-text .l-information { border-right: 0 !important; padding: 0; width: 100%; float: none; box-sizing: border-box; } .extra-banner-text .l-title { line-height: 20px; font-size: 12px; font-weight: normal; text-align: center; } .extra-banner-text .l-subtitle { color: #fff; font-size: 13px; line-height: 16px; text-align: center; } .extra-banner-text .l-link { margin: 20px 0 10px 0; line-height: 16px; font-size: 13px; display: block; text-align: center; width: 100%; } .l-section.slogan { color: #000; } .l-section.shop-by-gear { padding: 15px; } .shop-by-gear .l-panel { display: flex; overflow-x: scroll; } .shop-by-gear .l-item { min-width: 184px; } .shop-by-gear .l-thumb { margin: 15px auto 0 auto; width: 40px; height: 40px; } .shop-by-gear .l-text { white-space: pre-wrap; } .shop-by-gear .l-item:nth-child(2) .l-text { line-height: 1; } .l-section.shop-on-point { padding: 0 15px; } .l-section.shop-on-point .l-panel { display: flex; overflow-x: scroll; } .shop-on-point .l-item { min-width: 300px; } .shop-on-point .l-item:hover .l-text { display: none; } .shop-on-point .l-item:hover .l-information { background: rgba(0, 0, 0, .65); height: 120px; outline: none; } .l-section.shop-hot-products { padding: 0 15px; } .l-section.shop-hot-products .l-panel { display: flex; overflow-x: scroll; } .shop-hot-products .l-item { min-width: 245px; } .l-section.shop-for-community { padding: 0 15px; } .shop-for-community .l-panel:last-child { height: 150px; overflow-x: scroll; } .shop-for-community .l-row { height: 134px; } .shop-for-community .l-item { height: 126px; } .shop-for-community .l-item:nth-child(4) { margin-right: 95px; } .shop-for-community .l-subtitle { margin: 10px 10px 0 10px; } .shop-for-community .l-title { font-size: 18px; min-height: 94px; } .shop-for-community h3 p { display: none; } .shop-for-community .l-carousel-trigger { display: none; } .shop-for-community .l-carousel-dotted { display: none; } .shop-for-community .l-cta-explore { margin-top: 0; } .shop-for-community h3 { margin-top: 12px; } .shop-benefits .l-item, .shop-resources .l-item { padding: 0; } .l-section.shop-benefits { padding: 0 15px; } .shop-benefits .l-item:nth-child(1) .l-title, .shop-benefits .l-item:nth-child(2) .l-title, .shop-benefits .l-item:nth-child(3) .l-title { line-height: 1; } .shop-benefits .l-title { height: 66px; } .shop-benefits .l-text { padding: 0px 6px 10px 6px; height: 120px; } .l-section.shop-resources { padding: 0 15px; } .shop-resources .l-text { height: 112px; } .slick-next.slick-arrow { display: none; } } @media print, screen and (min-width: 1024px) and (max-width: 1280px) { .l-section { width: 1024px; } .shop-benefits .l-item:nth-child(1) .l-title { line-height: 1; } .extra-banner-text .l-item:not(:last-child) .l-information { border-right: 1px solid #fff; } } @media print, screen and (min-width: 73.75em) { .extra-banner-text .l-item:not(:last-child) .l-information { border-right: 1px solid #fff; padding-right: 20px; } .shop-for-community .l-item:nth-child(4) { margin-right: 95px; } } @media print, screen and (min-width: 46.875em) { .m-banner__bannerLink { background: #6ac346; border-color: #6ac346; padding: 0 24px; color: #fff; min-height: 45px; font-size: 16px; font-weight: 700; line-height: 46px; } .m-banner__bannerLink:hover { color: #6ac346; background-color: #e8f3f9; } } .product-stack { margin: 0 auto; width: 98%; padding-bottom: 3%; position: relative; margin-top: 30px; } .product-stack img { display: block; margin: auto; max-width: 280px; } .product-stack .module { margin-bottom: 1rem; text-align: center; width: 25%; } .product-stack .module p { padding: .25rem .75rem; } .column-module { border-right: 1px solid #eaeaea; } .shopnow-div { padding: 2%; } .shopnow-CTA { height: 55px; width: 148px; min-width: 222px; color: #fff; outline: none; font-size: 16px; font-weight: 400; border-radius: 5px; border: 1px solid transparent; background-color: #6ac346; display: block; float: none; margin: 0 auto; cursor: pointer; transition: .6s; font-weight: bold; } .shopnow-CTA:hover { color: #6ac346; background-color: #fff; border: 1px #6ac346 solid; } .product-title { font-size: 24px; font-weight: bold; color: #000; line-height: 1; height: auto; padding: 20px 0px; } .product-title a { color: #000; } .product-copy { font-size: 16px; color: #000; min-height: 141px; max-width: 317px; margin: auto; text-align: left; line-height: 19px; margin-top: 30px; } .pricing { font-size: 22px; color: #000; line-height: 1; display: none; } .best-seller { font-size: 32px; text-align: center; padding: 30px 0 15px 0; margin: 0; } .product-stack { display: flex; flex-wrap: wrap; max-width: 1920px; } @media (max-width: 1196px) { .product-stack img { max-width: 300px; } .product-stack .module { width: 49%; } .product-stack { justify-content: space-around; } .product-copy { min-height: 150px; } .product-stack .module:nth-child(2), .product-stack .module:nth-child(3) { border-bottom: 1px solid #e2e2e2; padding-bottom: 30px; } } @media (max-width: 768px) { .product-stack .module { width: 100%; } .product-stack .module:nth-child(2), .product-stack .module:nth-child(3), .product-stack .module:nth-child(4) { border-bottom: 1px solid #e2e2e2; padding-bottom: 10px; margin-bottom: 20px; } .shopnow-CTA { min-width: 148px; } .product-stack .module { margin-bottom: 10px; } .product-stack img { max-width: 300px; } } @media (max-width: 600px) { .product-copy { min-height: auto; } .product-title { font-size: 20px; } .shopnow-CTA { min-width: 160px; height: 44px; width: 126px; } .product-stack img { max-width: 250px; } .shop-on-point .l-information { width: 100%  !important; height: 75%  !important; } .shop-on-point .l-item { background: #f8f8f8; margin: 5px; border-radius: 9px; width: calc(50% - 14px)  !important; position: relative; overflow: hidden; display: inline-block; } .shop-on-point .l-title { white-space: normal  !important; } } @media (max-width: 430px) { .product-copy { min-height: auto; } .product-img { min-height: auto; } } .m-espotRedesign { color: #000; text-align: center; margin: 25px auto 20px auto } @media print, screen and (min-width: 73.75em) { .m-espotRedesign { width: 76.250em } } .m-espotRedesign__image { max-height: 220px; padding: 0 0 .4em } .m-espotRedesign__title { padding: 0; font-size: 1.25em; font-weight: 900; text-transform: uppercase; margin: .5em auto 0 auto; color: #6ac346; line-height: 1.1em; word-wrap: break-word } @media print, screen and (min-width: 73.75em) { .m-espotRedesign__title { font-size: 1.5em } } .m-espotRedesign__desc { padding: 5px .1em 0 .1em; margin: 0; font-size: .875em; font-weight: normal; color: #fff; line-height: 1.2em; word-wrap: break-word } @media print, screen and (min-width: 73.75em) { .m-espotRedesign__desc { font-size: 1.125em } } .m-espotRedesign__background { min-height: 225px } .m-espotRedesign__link { position: relative } .m-espotRedesign__text { background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; min-height: 180px; position: relative; padding: 20px } @media print, screen and (min-width: 46.875em) and (max-width: 73.74875em) { .m-espotRedesign__text { width: 750px; margin: 0 auto } } @media print, screen and (max-width: 46.87375em) { .m-espotRedesign__text { height: 150px  !important } } .m-espotRedesign__text::before { background: rgba(0, 0, 0, .5); content: ""; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100% } @media print, screen and (min-width: 73.75em) { .m-espotRedesign__text::before { background: rgba(0, 0, 0, .3) } } .m-espotRedesign__text:hover::before { background: rgba(0, 0, 0, .7); content: ""; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100% } .m-espotRedesign__espotPadding { padding: 8px 0 0 0 } @media print, screen and (min-width: 73.75em) { .m-espotRedesign__espotPadding { padding-left: .3em; padding-right: .3em } } .m-espotRedesign__textcontainer { position: relative; display: flex; justify-content: center; flex-direction: column; height: 100% } #pc_gaming { background: #000 url(https://static.lenovo.com/we/images/Students-Landing-Page/generic-header-1-EDU-background.jpg) no-repeat; color: #fff; margin: auto; padding: .5em; } #pc_gaming h2 { text-align: center; text-transform: uppercase; padding: .5em; color: #fff } #pc_gaming h4 { margin: 0px 11vw; color: #fff; margin-bottom: 10px; } .grid_box_5 { margin: auto; text-align: center; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr) .5fr; grid-gap: 10px; grid-auto-rows: minmax(200px, auto) } .grid_box_5 .box { border-radius: 10px; background: rgba(0, 0, 0, .25); padding: .5em; min-height: 120px } .grid_box_5 .box1 { grid-column: 1/2; grid-row: 1/2 } .grid_box_5 .box2 { grid-column: 2/3; grid-row: 1/2 } .grid_box_5 .box3 { grid-column: 1/2; grid-row: 2/3 } .grid_box_5 .box4 { grid-column: 2/3; grid-row: 2/3 } .grid_box_5 .box5 { grid-column: 1/3; grid-row: 3/4 } .box p { padding: .2em; color: #fff } .box img, .box svg { padding: .2em; padding-top: 1em; max-height: 72px; max-width: 135px; height: 72px } .view_all { width: 100%; background: rgba(0, 0, 0, .5); border: 1px solid #6ac346; border-radius: 5px; display: inline-block; margin: .8em auto } .view_all_fullwidth { display: none } .view_all a, .view_all_fullwidth a { width: 100%; display: inline-block; color: #fff; background: #6ac346; text-transform: uppercase; font-weight: 700; padding: 1em .5em; cursor: pointer; } .view_all_fullwidth a:hover { background: #fff; color: #6ac346; } .block_card:hover, .box:hover, .cat_card, .prod_slide { cursor: pointer } @media screen and (min-width:641px) { .block_card { display: inline-block; width: 49% } #pc_gaming { padding: 0 } #pc_gaming h2 { font-size: 44px; font-weight: 400 } #pc_gaming h4 { line-height: 25px; font-size: 16px; } #pc_gaming { background: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), url(//static.lenovo.com/we/assets/img/student-store/LenovoEDU_Revamp/largeGrid/Why-to-join-LenovoEDU-Store-BG-1.jpg) no-repeat; background-size: cover; background-position: center center } .grid_box_5 { margin: auto; text-align: center; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr) .5fr; grid-gap: 0; grid-auto-rows: minmax(60px, auto) } .grid_box_5 .box { border-radius: 0; background: rgba(0, 0, 0, .25); padding: 3em; min-height: 170px; border: 1px solid rgba(255, 255, 255, .5); height: 100% } .grid_box_5 .box:nth-of-type(1), .grid_box_5 .box:nth-of-type(3) { border-left: 0 } .grid_box_5 .box:nth-of-type(2), .grid_box_5 .box:nth-of-type(4) { border-right: 0 } .view_all { max-width: 400px; padding: .25em .5em; height: 64px; background: #6ac346; } .view_all a { font-size: 1.1em } .box img, .box svg, .grid_box_5 .box:nth-of-type(1) img, .grid_box_5 .box:nth-of-type(1) svg { padding: 0; max-width: 108px; max-height: 72px; margin-top: 4%; height: 72px } #pc_gaming .grid_box_5 .box:nth-of-type(1) img, #pc_gaming .grid_box_5 .box:nth-of-type(1) svg { margin-top: 15px } .box p { margin-top: 15px; font-weight: lighter; font-weight: 300 } } @media screen and (min-width:1181px) { .block_card:hover .hover_espot { display: block } #pc_gaming { background: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), url(//static.lenovo.com/we/assets/img/student-store/LenovoEDU_Revamp/largeGrid/Why-to-join-LenovoEDU-Store-BG-1.jpg) no-repeat; background-size: cover; background-position: center center } #pc_gaming h2 { margin-top: 75px; color: #6ac346; } #pc_gaming { text-align: center; margin: auto; height: 518px } .split_50 { width: 49.6%; display: inline-block; vertical-align: top } #pc_gaming .split_50:nth-of-type(2) { position: relative } .grid_box_5 { position: relative; right: 0; top: 0; height: 518px } .grid_box_5 { text-align: center; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-gap: 0; grid-auto-rows: minmax(60px, auto) } .grid_box_5 .box5 { display: none } .view_all_fullwidth { display: block; width: fit-content; max-width: 500px; min-width: 180px; background: rgba(0, 0, 0, .5); border: 1px solid #6ac346; border-radius: 5px; margin: .8em auto; margin-top: 50px; } .grid_box_5 .box:nth-of-type(1), .grid_box_5 .box:nth-of-type(3) { border-left: 1px solid rgba(255, 255, 255, .5) } .grid_box_5 .box:nth-of-type(2), .grid_box_5 .box:nth-of-type(4) { border-right: 1px solid rgba(255, 255, 255, .5) } .box img, .box svg { margin: 2.5em !important } .box p { display: none } .box:hover p { display: block; padding-top: 3em !important; font-weight: 700; font-size: 24px } #pc_gaming .box1:hover p, #pc_gaming .box2:hover p { padding-top: 6em !important } #pc_gaming .box3:hover p, #pc_gaming .box4:hover p { padding-bottom: 6em !important; padding-top: 0 !important; margin-top: -1em } .box:hover img, .box:hover svg { display: none } .box { position: relative } .box::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: .25s ease opacity } .box p { transition: .25s ease opacity } .box::before { opacity: 0 } .box:hover::before { opacity: 1 } .box:hover p { display: block; padding-top: 3em !important; font-weight: 700; font-size: 24px; z-index: 9999; position: relative } #pc_gaming .box1::before { opacity: : 1; box-shadow: inset 0 0 100px 100px rgb(255 255 255 / 30%); } #pc_gaming .box2::before { opacity: : 1; box-shadow: inset 0 0 100px 100px rgb(255 255 255 / 30%); } #pc_gaming .box3::before { opacity: : 1; box-shadow: inset 0 0 100px 100px rgb(255 255 255 / 30%); } #pc_gaming .box4::before { opacity: : 1; box-shadow: inset 0 0 100px 100px rgb(255 255 255 / 30%); } .block_card { display: inline-block; width: 24%; width: 32%; vertical-align: top; height: 192px; margin: 0 .1em } .block_card p { font-size: 1.5em; font-weight: 700 } } #legales { background-color: #f8f8f8; padding: 20px 10px 40px; position: relative } #legales h2 { text-align: center; width: 80%; margin: 0 auto 20px; font-size: 28px; color: #000; font-weight: 700; } #legales p { margin-bottom: 20px; font-size: 16px; color: #000; } #legales p span { font-weight: 700; display: block } #legales a { color: #1976a1 } #legales .legal-copy { height: auto; max-height: 150px; overflow: hidden; position: relative; -webkit-transition: max-height .7s ease-out; -o-transition: max-height .7s ease-out; transition: max-height .7s ease-out } #legales .legal-copy::after { content: ''; width: 100%; height: 100px; bottom: 0; background: -o-linear-gradient(top, rgba(248, 248, 248, .1) 0, rgba(248, 248, 248, .8) 30%, #f8f8f8 84%, #f8f8f8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(248, 248, 248, .1)), color-stop(30%, rgba(248, 248, 248, .8)), color-stop(84%, #f8f8f8), to(#f8f8f8)); background: linear-gradient(to bottom, rgba(248, 248, 248, .1) 0, rgba(248, 248, 248, .8) 30%, #f8f8f8 84%, #f8f8f8 100%); position: absolute; z-index: 1 } #legales .legal-copy.active { max-height: 3600px } #legales .legal-copy.active::after { opacity: 0 } #legales .legal-copy.active+.legal-btn p::after { margin-top: 2px; -webkit-transform: translateY(-50%) rotate(135deg); -ms-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg) } #legales .legal-btn { border: 1px solid #e3e3e3; border-right: none; border-left: none; cursor: pointer; height: 55px; position: relative; z-index: 2 } #legales .legal-btn p { font-weight: 700; color: #6ac346; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); cursor: pointer } #legales .legal-btn p::after { content: ''; width: 8px; height: 8px; border-left: 2px solid #6ac346; border-bottom: 2px solid #6ac346; position: absolute; top: 50%; -webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); right: -20px; margin-top: -2px; -webkit-transition: -webkit-transform .5s ease; transition: -webkit-transform .5s ease; -o-transition: transform .5s ease; transition: transform .5s ease; transition: transform .5s ease, -webkit-transform .5s ease } #legales .legal-container { position: relative; max-width: 1280px; margin: auto } @media (min-width:650px) { #legales { padding: 20px 20px 40px } } @media (min-width:1180px) { #legales { padding: 30px 20px } } .container { width:1324px; display:block; margin:1em auto; overflow:hidden; } p, h1, h2, h3, h4 { color:#000; display:block; } p { font-size:16px; line-height:24px; } p.white { color:#fff; text-align:center; font-size:20px; line-height:22px; margin-bottom:20px; } h1 { font-size:36px; line-height:40px; } h2 { font-size:30px; line-height:33px; } h3 { font-size:24px; } h4 { font-size:18px; } a.button { width: auto; height:auto; padding:15px 12px; margin: 0; display: inline-block; cursor: pointer; background: #000; line-height: 1em; font-weight: 700; border:0; border-radius:4px; text-align: center; color:#fff; font-size:18px; text-decoration:none; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; font-family: 'Lato', sans-serif; letter-spacing:.25px; float:none; border:1px solid #000; } a.button:hover { background:#fff; color:#000; border:1px solid #000; } .hero a.button { width:40%; } a.button.large { width:45%; } a.button.center { display:block; margin:40px auto; float:none; width:250px; } a.button.whiteBlue { background:#fff; color:#0d5c91; } a.button.noTop { margin-top:10px; margin-bottom:0; } a.button.white { background:#fff; border:1px solid #fff; color:#000; margin-right:40px; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } a.button.white:hover { background:#000; color:#fff; border:1px solid #fff; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } a.button.clear { background:rgba(0,0,0,.2); border:1px solid #fff; color:#fff; } a.button.clear:hover { background:rgba(0,0,0,0.8); } a.button.blue { background:#0d5c91; } a.button.blue:hover { background:#e6f4fa; color:#0d5c91; border:1px solid #0d5c91; } a.button.clearBlue { background:#e6f4fa; color:#0d5c91; } a.button.clearBlue:hover { background:#fff; } .contactBlade { background:url(https://www.lenovo.com/content/dam/lenovo/ecommerce/global/smb/campaigns/2021-whylenovopro-midfunnel/landing-page/images/bottomBladeBG.jpg); background-size:cover; height:400px; } .contactCaption { width:40%; display:block; margin:100px auto; float:none; } .contactCaption div { display:flex; justify-content:center; } .contactBlade h2 { font-size:32px; line-height:39px; margin-bottom:20px; } .contactBlade p, .contactBlade h2 { color:#fff; text-align:center; } .contactBlade a { margin:0 10px; } .contactBlade a, .contactBlade a:hover { color:#fff; text-decoration:none; } .contactBlade a.button { float:none; display:block; margin:40px auto 0; width:200px; } .contactBlade a.button:hover { color:#000; } .contactBlade a.button.white:hover { color:#fff; } .contactBlade a.button.white { width:auto; } .footnotes { padding:40px 0; } .footnotes p { font-size:16px; line-height:20px; margin-bottom:20px; } .footnotes hr { height:1px; background:rgba(119,119,119,.5); margin:20px auto; border:0; } @media screen and (max-width: 1500px) { .container { width:1304px; } .contactBlade { background-position:-275px; } .heroCarousel .slide.four { background-position:-300px; } } @media screen and (max-width: 1344px) { .container { width:1020px; } .heroCaption { width:700px; } .heroCaption h1 { width:65%; } .valueBox { width:30%; margin:0 10px; } .textSide { padding-top:50px; } .textSide p { width:70%; } .textSide h3, .textSide p, .textSide a.button { margin-left:40px; } .textCol { padding-right:100px; } .contactBlade { background-position: -525px; } .contactCaption { width:50%; } .proCommunity img { height:75px; width:auto; } .proCommunity li { font-size: 18px; line-height: 24px; margin-bottom: 15px; } .cardText { height:225px; } } @media screen and (max-width: 1080px) { .container { width:900px; } .partnerLogos img { height:35px; } .videoBar video { width:75%; } .textSide h3 { width:80%; } .textSide { padding-top:30px; } .communityTop .proVideo { width:50%; padding-top:40px; } .proCommunity { width:50%; position:relative; } .cardText { padding:15px; height:270px; } .contactBlade { background-position: -650px; } .partnerLogos img.intelLogo { height: 75px; top: 20px; position: relative; } } @media screen and (max-width: 960px) { .page { padding-top:60px; } .container { width:728px; } .partnerLogos { top: 20px; right: 20px; } .heroCaption { width:auto; margin-left:20px; } .heroCaption h1 { width: 55%; } .halfBlock { height:425px; } .imageSide img { height: 450px; object-position: -100px; } .community { padding-top:10px; } .communityTop { flex-direction:column-reverse; } .communityTop .proVideo, .communityTop .proCommunity { width:auto; } .proVideo video { margin:0 auto; } .proCommunity img { height:125px; } .proCommunity ul { display:flex; justify-content:space-around; margin:20px 0 0; } .proCommunity ul li { display:block; width:27%; } .communityCards { display:none; } .communityCards li:hover { transform:none; } .communityCardsMobile li { padding:0 10px; } .communityCardsMobile.slick-slider { display:block; } .communityCardsMobile .slick-dots li button:before { font-size:42px; opacity:.5; margin-top:10px; color:#fff; } .communityCardsMobile .slick-dots li.slick-active button:before { color:#fff; opacity:1; } .communityCardsMobile .slick-prev:before, .communityCardsMobile .slick-next:before { display:none; } .communityCardsMobile .cardImage { border-top-left-radius:10px; border-top-right-radius:10px; overflow:hidden; } .communityCardsMobile .cardText { border-bottom-left-radius:10px; border-bottom-right-radius:10px; overflow:hidden; } .cardImage { height:250px; } .cardImage img { height:265px; } .valueBox .cardImage { height:125px; } .valueBox .cardText p.desc { font-size:14px; line-height:18px; } .valueBox .cardImage img { height:150px; } .community a.button { margin-top:80px; } .proLogin { padding-top:10px; } .contactBlade { background-position: -825px; } .contactCaption { margin:75px auto; } .reasonsBar ul li:hover { box-shadow:none; } .proCol img.communityLogo { height: 20px; margin-bottom: 28px; } .dotCom.heading, .proCol.heading { margin:0; width:194px !important; } .dotCom, .proCol { width: 194px !important; display: inline-block; margin: 0; } .proCol { border:0; } .textCol { padding-right: 25px; } .dotCom h3 { line-height: 29px; font-size: 24px; } .proCommunityCard { width:600px; } p.title span { display:block; clear:both; } } @media screen and (max-width: 768px) { .container { width:560px; } .heroCaption .container, .heroBoxes, .heroBoxes .slick-list { overflow:visible !important; } .partnerLogos { position:relative; width:auto; display:flex; justify-content:center; right:0; top:40px; } .partnerLogos img { margin-left:0; } .partnerLogos img.intelLogo { height: 75px; top: -18px; position: relative; } .partnerLogos img:first-child { margin-right:150px; } .heroCaption { text-align:center; width:80%; margin:80px auto 40px; float:none; } .heroCaption h1 { width:auto; } .heroCaption ul { justify-content:center; } .heroCaption ul li { margin:0; } .heroBoxes { flex-direction:column; justify-content: center; } .valueBox { width:400px !important; margin:0 30px; } .valueBox .cardImage { height:200px; } .valueBox .cardImage img { height:225px; } .valueBox .cardText { height:auto; } .valueBox .cardText .buttonContainer { position:relative; margin:20px 0; height:auto; } .solutions .container { overflow:visible; } .halfBlock, .halfBlock.reverse { flex-direction:column-reverse; margin:0 20px; border-radius:10px; } .halfBlock.reverse .textSide h3, .halfBlock.reverse .textSide p, .halfBlock .textSide h3, .halfBlock .textSide p, .halfBlock .textSide a.button, .halfBlock.reverse .textSide a.button { margin-left:20px; margin-right:0; text-align:left; float:left; } .textSide p { width:90%; } .imageSide, .textSide { width:100%; overflow:hidden; } .textSide { margin-bottom:25px; } .imageSide { height:200px; } .imageSide img { height:auto; min-width:100%; } .halfBlocks .slick-dots li.slick-active button:before, .halfBlocks .slick-dots li button:before { color:#000; } .halfBlocks .slick-dots { bottom:-30px; } .halfBlocks .slick-next { background-image:url(https://www.lenovo.com/content/dam/lenovo/ecommerce/global/smb/campaigns/2021-whylenovopro-midfunnel/landing-page/images/arrowright-bl.svg); right:-40px; } .halfBlocks .slick-prev { background-image:url(https://www.lenovo.com/content/dam/lenovo/ecommerce/global/smb/campaigns/2021-whylenovopro-midfunnel/landing-page/images/arrowleft-bl.svg); left:-40px; } a.button.bottom { margin-top:40px; } .proCommunity ul { flex-direction:column; } .proCommunity ul li { width:70%; margin:0 auto 20px; display:list-item; list-style-type:disc; } .contactBlade { background-position: -1000px; position:relative; height:450px; } .contactBlade .inner { background:rgba(0,0,0,.4); position:absolute; width:100%; height:100%; top:0; left:0; } .mfHero .slick-prev:before, .mfHero .slick-next:before { display:none; } .proLogo img { width:85%; } .tableCont a.button { width: 250px; } .contactCaption div { display:none; } .communityCardsMobile li.proCommunityCard { width:400px; } tr { border-bottom:0; } th { height:150px; } .dotCom { border:2px solid #000; } .dotCom.heading, .proCol.heading { width:273px !important; margin:0; } .dotCom, .proCol { width: 225px !important; display: inline-block; margin: 0 26px; } .proCol { border:2px solid #000; border-left:0; } } @media screen and (max-width: 600px) { .container { width:90%; } .heroCaption h1 { font-size:32px; line-height:40px; margin-bottom:15px; } .heroCaption p { font-size:18px; line-height:26px; margin-bottom:30px; } .videoBar, .communityTop .proVideo { display:none; } .cardImage { height:175px; } .cardImage img { height:200px; } .cardText { padding:30px; } .mobileCard { width:80%; } .solutions { padding-top:0; } .contactCaption { width: 75%; } .contactBlade { background-position: -1125px; height:430px; } .proLogo { display:none; } .proLogin { width:100%; justify-content:space-between; padding-top:0; text-align:left; } .proLogin a.button { background:transparent; color:#fff; } .phoneBar { font-size:21px; line-height:21px; padding:10px 0; } .phoneBar svg { height:16px; margin-left:5px; } .phoneBar span { display:none; } .valueBox { width:475px !important; margin:0 10px; } .valueBox .cardImage { height: 175px; } .valueBox .cardImage img { height: 200px; } .testimonialBlade .slick-next, .testimonialBlade .slick-prev, .solutions .slick-prev, .solutions .slick-next { display:none !important; } .testimonialBlade h2 { margin-bottom:20px; } .testimonialBlade p { width:95%; font-size:16px; line-height:24px; } .tableCont a.button, .solutions a.button.bottom { width:90%; } .solutions a.button.bottom { margin-top:75px; } .communityCardsMobile li.proCommunityCard { width: 325px; } .dotCom.heading, .proCol.heading { width: 241px !important; margin: 0; } .dotCom, .proCol { width: 189px !important; } .proCol { border:2px solid #000; border-left:0; } } @media screen and (max-width: 450px) { .mfHero { padding-bottom:80px; } .proCommunity img { width:80%; height:auto; } .halfBlocks .slick-list { height:575px !important; } .halfBlock { height:auto !important; } .halfBlock, .halfBlock.reverse { width:275px !important; } .partnerLogos img:first-child { margin-right: 10%; } .heroCaption ul { flex-direction:column; } .heroCaption ul li { margin:10px auto; } .heroCaption ul li:first-child { margin-right:auto; } .heroCaption ul li:first-child a.button.white { margin-right:auto; } .valueBox { width: 300px !important; } .proCol img.communityLogo { height: 12px; } .dotCom h3 { line-height: 17px; font-size: 16px; } table a.button { font-size:14px; padding:10px; } th { height:175px; } th, tr { border:0; } .cardText { height: 275px; } .cardImage { height:125px; } .cardImage img { height:150px; } .community a.button { width:200px; } .contactBlade { height:525px; background-position: -1375px; } .contactCaption { width:85%; } .reasonsBar ul li { width: 50%; } .reasonsBar ul li p { font-size:16px; } .halfBlock a.button { background:transparent; padding:0; color:#000; border:0; } .dotCom, .proCol { width: 90px !important; display: inline-block; margin: 0 35px; } .dotCom.heading, .proCol.heading { width: 161px !important; margin: 0; } th { height:150px; } } @media screen and (max-width: 400px) { .dotCom.heading, .proCol.heading { width: 150px !important; margin: 0; } .dotCom, .proCol { width: 90px !important; display: inline-block; margin: 0 30px; } } @media screen and (max-width: 300px) { .reasonsBar ul { flex-direction:column; } .reasonsBar ul li { width:auto; } .contactBlade { height:600px; background-position:-2000px; } .dotCom.heading, .proCol.heading { width: 123px !important; margin: 0; } .dotCom, .proCol { margin: 0 16px; } .valueBox { width: 200px !important; } .halfBlock, .halfBlock.reverse { margin: 0 10px; } .communityCardsMobile li.proCommunityCard { width: 175px; } }