.msaMastheadPage .body-inner-wrapper header .bar_2, .footer-bar_3-logos { 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; } .o-mastheadModule{ position: fixed; } main * { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; line-height: 1.1; } #chrome-nav { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; background: #e1e1e1; height: 70px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 25px; display:none; z-index:2; max-width:1920px; margin:auto; position:relative; top:0 } #chrome-nav.chromeSticky{ position:fixed; left:50%; transform:translateX(-50%) translateY(-1px); box-shadow: 0 3px 6px #00000029; } #chrome-nav figure { width: 150px; } #chrome-nav figure img { width: 100%; } #chrome-nav ul { padding: 0; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-left: 24px; position: relative; height: 100%; } #chrome-nav ul li { height: 100%; line-height: 70px; position: relative; } #chrome-nav ul li#bullet { position: absolute; width: 100px; height: 5px; bottom: 0; background: #0e5780; -webkit-transition: all .25s ease-in-out; transition: all .25s ease-in-out; } #chrome-nav ul li:not(:last-child) { margin-right: 24px; } #chrome-nav ul li a { text-decoration: none; color: black; font-weight: bold; font-size: 16px; } #hero { width: 100%; margin: auto; max-width: 1920px; height: auto; position: relative; } #hero * { color: white; } #hero article { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; bottom: 0; left: 0; background: rgba(0, 0, 0, .877); text-align: center; padding: 0 20px 40px; } #hero .hero_image{ width:100%; height:300px; background: url('//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/images/lenovo-chromebook-work-from-home-section.jpg') center center no-repeat; background-size:cover; } #hero article img { width: 154px; margin-top: 16px; margin-bottom: 12px; } #hero article h2 { font-size: 28px; } #hero article p { font-size: 18px; margin-bottom: 19px; } #hero article a { background: #0e5780; border-radius: 4px; text-decoration: none; height: 45px; display: inline-block; line-height: 43px; padding: 0 56px; border: solid 1px white; font-weight: bold; font-size: 16px; text-transform:capitalize } #hero article a:hover,#explore article div > a:hover{ border: solid 1px #0e5780; color: #0e5780; background: #e8f3f9; -webkit-transition: all .25s ease-out; transition: all .25s ease-out; text-decoration:none } #hero article a:active, #explore article div > a:active{ background: #1976a1; color: #e8f3f9; -webkit-transition: all 0s ease-out; transition: all 0s ease-out; } #hero .hero_video { text-align: center; height: auto; } #hero .hero_video video { width: calc(100% - 40px); max-width: 450px; position: relative; top: -20px; -webkit-box-shadow: -2px 5px 40px rgba(0, 0, 0, .39); box-shadow: -2px 5px 40px rgba(0, 0, 0, .39); } #cards { width: 100%; margin: auto; max-width: 1920px; } #cards > article { margin-top: 24px; } #cards > article:first-child .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/images/lenovo-chromebook-homepage-stay-safe-with-built-in-virus-protection-v2.jpg") center center no-repeat; background-size: cover; } #cards > article:nth-child(2) .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/images/lenovo-chromebook-work-from-home-simple-set-up.jpg") center center no-repeat; background-size: cover; } #cards > article:nth-child(3) .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/images/lenovo-chromebook-work-from-home-apps-for-productivity.jpg") center center no-repeat; background-size: cover; } #cards > article .flag { color: white; height: 30px; line-height: 30px; padding: 0 15px; border: none; margin-bottom: 23px; } #cards > article .flag.purple { background: #4c1984; } #cards > article .card_image { width: 100%; height: 274px; } #cards > article div:last-child { text-align: center; background: #f2f2f2; padding: 0 22px; height: 273px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #cards > article div:last-child p { font-size: 18px; color: black } #cards > article div:last-child h2 { font-size: 22px; font-weight:bold; margin-bottom: 4px; color: black } .twoCards { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: scroll; background: #e1e1e1; padding: 20px 10px; } .twoCards article { min-width: 90%; border-radius: 8px; overflow: hidden; background: #f8f8f8; margin: 12px 12px; } .twoCards article .card_image { height: 230px; } .twoCards article:first-child { margin: 0 12px; } .twoCards article div:last-child { height: 230px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0 12px; } .twoCards article div:last-child p { min-height: 97px; font-size: 18px; padding-bottom: 12px; text-align: center; } .twoCards article div:last-child a { color: #0e5780; text-decoration: none; } .twoCards article div:last-child a:hover { color: #0e5780; text-decoration: underline; } .twoCards article div:last-child a:active { color: #2da7d4; } #explore { background: #e1e1e1; text-align: center; max-width: 1920px; margin: 24px auto 0; } #explore > h2 { font-size: 28px; padding: 38px 0 4px; font-weight: bold; color:black } #explore > p { font-size: 16px; padding-bottom: 30px; color:black } #explore article { min-width: 250px; margin-bottom: 0; margin-top: 0; height: 500px; -webkit-box-shadow: 0 3px 10px #00000029; box-shadow: 0 3px 10px #00000029; position: relative; padding-top: 70px; } #explore article .chromebookLogo { width: 84px; position: absolute; right: 20px; top: 20px; } #explore article .chromebookLogo img { width: 100%; } #explore article .card_image { height: 139px; width: 90%; margin: auto; } #explore article:last-child .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/products/Case_Logic_13.3_Laptop_sleeve.png") center center no-repeat; background-size: 100%; } #explore article:nth-child(2) .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/products/Lenovo-Wired-USB-Mouse.png") center center no-repeat; background-size: 100%; } #explore article:first-child .card_image { background: url("https://www.lenovo.com/medias/GXD1B67867-500-1.png?context=bWFzdGVyfHJvb3R8Njg0Nzd8aW1hZ2UvcG5nfGg5MC9oOTIvMTEyNTY0NTI0MTU1MTgucG5nfDMxY2JkZGIwMjRmNThjNGZmOGRkZmYzMGE5MWU3NTA0NDk3NTM4NmIwZjg3NzA1ZDI0ZmViODRlZmFmZTE4ZTA") center center no-repeat; background-size: 100%; } #explore article:nth-child(3) .card_image { background: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/products/Logitech_H111_Stereo_Headset_with_3.5_mm_Audio_Jack_for_Education-headset.png") center center no-repeat; background-size: 100%; } #explore article h2 { padding: 42px 20px 14px; font-size: 18px; line-height: 1.1; } #explore article h2 a { color: #0e5780; font-weight: 900; } #explore article .price span { font-size: 12px; } #explore article .price p { font-size: 26px; font-weight: 900; color:black } #explore article div > a { background: #0e5780; color: white; height: 45px; line-height: 45px; padding: 0 24px; border-radius: 4px; width: calc(100% - 40px); } @media (min-width: 750px) { #hero article img { width: 200px; } #hero article h2 { margin-bottom: 12px; } #cards .twoCards { margin-top: 30px; padding-top: 52px; } #cards article div:last-child h2 { margin-bottom: 15px; font-size: 26px; } #cards article .card_image { height: 315px; } #explore > h2 { padding: 34px 0 6px; font-size: 28px; } #explore > p { padding-bottom: 40px; font-size: 18px; } #explore .twoCards article { min-width: 320px; height: 480px; } #explore .twoCards article div:last-child { height: auto; } #explore .twoCards article .card_image { height: 177px; } #explore .twoCards article h2 { padding: 23px 20px 14px; height: 100px; } #explore .twoCards article .price p { min-height: auto; } } @media (min-width: 1280px) { #chrome-nav { display: -webkit-box; display: -ms-flexbox; display: flex; top:0; left:0 } #hero { min-height: 600px; background-image: url("//static.lenovo.com/na/landing-pages/chromebooks/chromebooks-brand-pages/images/lenovo-chromebook-work-from-home-section.jpg"); background-position: bottom center; background-repeat: no-repeat; background-size: cover; } #hero figure, #hero .hero_image { display: none; } #hero article { width: 50%; height: 600px; text-align: left; background: rgba(0, 0, 0, .8); padding-left: 75px; padding-right: 106px; } #hero article img { width: 320px; margin-top: 95px; margin-bottom: 33px; } #hero article h2 { font-size: 52px; } #hero article p { width: auto; margin: 14px auto 23px; } #hero .hero_video { margin-top: -170px; } #cards > article { margin: 0 auto; 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; height: 660px; } #cards > article:nth-child(even) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } #cards > article .card_image, #cards > article div:last-child { height: 100%; width: 50%; -webkit-box-sizing: border-box; box-sizing: border-box; } #cards > article div:last-child { text-align: left; padding: 0 97px; background:white; align-items: flex-start; } #cards > article div:last-child h2 { font-size: 52px; width: 100%; } #cards > article:nth-child(4) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } #cards .twoCards { padding: 46px 57px 58px; } #cards .twoCards article { width: 50%; min-width: inherit; } #cards .twoCards article .card_image { height: 243px; } #explore { padding-bottom: 98px; margin-top: 0; } #explore > h2 { font-size: 52px; padding: 62px 0 6px; } #explore > p { font-size: 20px; padding-bottom: 55px; } #explore .twoCards { width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: hidden; } #explore .twoCards article { width: 328px; height: 490px; } #explore .twoCards article .card_image { height: 177px; width: 250px; } } @media (min-width: 1600px) { #hero article { width: 600px; } #cards article .card_image { width: 1280px; } }