@import url(https://canada.lenovo.com/fr/_c1-ofp_static_pub/ShareResource/events/techlife/css/override/01_font-awesome.min.f7fbdcad139be9e5.css); @import url(https://canada.lenovo.com/fr/_c1-ofp_static_pub/ShareResource/events/techlife/css/override/02_ionicons.min.2e88aa30d965472f.css); #oo_tab, #oo_bar { display: none  !important; } body, html { margin: 0; padding: 0; } .vid-item .desc { color: #fff; } .vid-item:hover .desc { } .mlvp-arrow-left, .mlvp-arrow-right { color: #111; } .mlvp-arrow-left:hover, .mlvp-arrow-right:hover { color: #cc181e; } .mlvp-arrows { } .player-container { width: 100%; } .ui-body { border: none  !important; } .ui-page-active { outline: none  !important; } .player-container h3 { margin-bottom: 4px; } .mlvp-container-bg { background: rgba(0, 0, 0, .85); height: 100%; left: 0; overflow: hidden; position: fixed; top: 0; width: 100%; z-index: 70; visibility: hidden; } .mlvp-container { position: fixed; padding-bottom: 52%; padding-top: 38px; height: 0; display: none; z-index: 998  !important; } .mlvp-container iframe, .mlvp-container object, .mlvp-container embed { position: fixed; top: 10%; width: 80%; height: 85%; z-index: 99; } .show-mlvp { display: block; background: rgba(0, 0, 0, .85); height: 100%; width: 100%; } .mlvp-list-container { overflow: hidden; margin-left: 0  !important; margin-right: 0  !important; padding-bottom: 20px; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; } .mlvp-list { width: 100%  !important; position: relative; top: 0; left: 0; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; } .vid-item { display: block; width: 230px; height: 200px; margin: 0 .8em; float: left; padding: 0; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit; position: relative; overflow: hidden; } .thumb { overflow: hidden; height: 145px; } .thumb img { width: 100%; position: relative; top: -14px; } .vid-item .desc { margin-top: 5px; font-size: .7em; text-align: center; line-height: 1.2em; text-transform: uppercase; width: 100%; white-space: pre-wrap; } .vid-item:hover { cursor: pointer; } .vid-item:hover .thumb { border: 1px solid #ff6807; } .vid-item:hover .thumb img { opacity: .7; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; } .vid-item .play-btn { color: #fff; position: absolute; top: 45px; width: 40px; height: 0; left: 106px; opacity: 0; font-size: 3em; } .vid-item:hover .play-btn { opacity: 1; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; } .noselect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .mlvp-arrows { position: relative; width: 100%; top: 38px; display: none  !important; } .mlvp-arrow-left { position: absolute; padding: 0; left: 0; top: 0; cursor: pointer; } .mlvp-arrow-left img { width: 22px; } .mlvp-arrow-right { position: absolute; padding: 0; right: 0; top: 0; cursor: pointer; } .mlvp-close { position: fixed; padding: 5px; right: 8%; top: 4%; z-index: 999; cursor: pointer; font-size: 3em; color: #418cdd; width: 30px; height: 30px; text-align: center; } .mlvp-close img { width: 48px; } .demo-icon { font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; font-size: 32px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media only screen and (max-width: 768px) { .vid-item { width: 40%; height: auto; } } @media only screen and (max-width: 1392px) { .mlvp-container iframe, .mlvp-container object, .mlvp-container embed { left: unset; width: 100%; } .mlvp-close { right: 0%; } } @media only screen and (max-width: 500px) and (max-height: 800px) and (orientation:landscape) { .mlvp-container iframe, .mlvp-container object, .mlvp-container embed { top: 10%; width: 100%; height: 500px; } .mlvp-close { top: 0; } } @media only screen and (max-width: 1200px) { .mlvp-container iframe, .mlvp-container object, .mlvp-container embed { top: 10%  !important; left: 0  !important; width: 100%  !important; height: 500px  !important; } .mlvp-close { top: 0; } } @media only screen and (max-width: 1200px) and (orientation:portrait) { .mlvp-close { top: 5%; } }