ul, li { padding: 0px; margin: 0px; } .recentcaption { color: #999; } .livetile { width:83px; height:83px; color:#fff; margin:0px 7px 7px 0px; display:inline-block; float:left; background-position:center 33%; background-repeat:no-repeat; font-family: opensans_regular; font-size:9px; position:relative; overflow:hidden; //white-space:nowrap; cursor:pointer; } span.livetilett { position:absolute; top:2px; right: 2px; } span.livetilettclose { position:absolute; top:2px; right:2px; } span.livetilett { font-size: 0px; line-height: 0%; width: 0px; border-top: 15px solid #888; border-left: 15px solid transparent; } span.livetilett:hover { border-top-color: #399E47; } .livetile a { cursor:default; } .livetile span.textwrapper { xposition:absolute; display:inline-block; left:0px; bottom:2px; width:83px; cursor:pointer; overflow: hidden; } .livetile span.centertext { text-align:center; } .livetile h3 { margin-left:5px; margin:0px; padding:4px 4px 4px 4px; font-family: opensans_regular; font-weight:normal; font-size:14px; cursor:default; } .livetile h3 + span.textwrapper { position:static; padding:0px 5px; cursor:default; } .biglt { width:207px; } .biglt span.textwrapper { width:190px; } .ltc1 { background-color:#A600A7; } .ltc2 { background-color:#085ABE; } .ltc3 { background-color:#0099AE; } .ltc4 { background-color:#5537B0; } .ltc5 { background-color:#2688ED; } .ltc6 { background-color:#D7562A; } .ltc7 { background-color:#009B00; } .ltc8 { background-color:#B91B46; } .ltcenterimage { width:50px; height:50px; margin:auto auto; } .ltbottombar { height:26px; } .livetile span.textwrapper { max-height:26px; overflow:hidden; } .livetile img { width:83px; } .livetile .imagewrapper { overflow:hidden; height:57px; position:static; width:83px; display:inline-block; cursor:pointer; } /* styles needed for both sections */ .tooltip_container { //background:#D3D3D3; font-size: 14px; margin-right: 5px; overflow: hidden; padding: 2px; position: relative; width: 280px; } /* styles for sample 2 with a few containters */ .tooltip_picture { float: left; height: 65px; width: 65px; margin: 5px; } .upperList { float: left; height: 65px; list-style: none outside none; margin: 5px 0 0; overflow: hidden; padding: 0; width: 200px; font-size:0; } .upperList li { display: inline-block; height: 14px; line-height: 14px; margin: 1px; overflow: hidden; padding: 3px; text-overflow: ellipsis; white-space: nowrap; width: 200px; font-size:14px; } .lowerList { clear: both; list-style: none outside none; margin-left: 5px; padding: 0; font-size:0; width:270px; } .lowerList li { display: inline-block; height: 14px; line-height: 14px; overflow: hidden; padding: 2px; text-overflow: ellipsis; white-space: nowrap; width: 265px; margin:1px; font-size:12px; } .livetile .picturelink { position: relative; cursor: pointer; background-repeat: no-repeat; background-size: 83px; height: 100%; width: 100%; display: block; background-color: #FFF; } .livetile .picturecaption { background-color: #222; padding-top: 3px; opacity: 0.7; color: #fff; height: 24px; position: absolute; bottom: 0px; text-align: center; width: 100%; } .livetile:hover { box-shadow: 0px 0px 0px 2px rgba(130,130,130,1); }