/* grid & list view */ .bbg_list { overflow: auto; } .bbg_video_back_button { position: absolute; top: 10px; left: 10px; z-index: 99; color: white; cursor: pointer; } .bbg_list .ui-scrolldiv { position:relative; background-color:#FFFFFF; /* required to avoid scrollwheel/hover bugs on IE */ } .bbg_list .thumbnail { position:relative; margin:0; padding:1em 0.5em 1em 0.5em; border:none; font-family:Helvetica; font-weight:bold; color:#303030; cursor:pointer; cursor:hand; } .bbg_list .thumbnail .imgbox { width:16em; height:9em; overflow:hidden; margin-bottom:0.5em; } .bbg_list .thumbnail .imgbox .geoblocked { position:absolute; display:none; top:7.2em; left:0.5em; width:16em; height:auto; padding:0.3em 0 0.3em 0; color:white; text-align:center; background-image:url(./img/geoblockedbkg.png); } .bbg_list .thumbnail .imgbox .thanksie6, .bbg_list .thumbnail .imgbox .thanksvote, .bbg_list .thumbnail .imgbox .thanksrate { position:absolute; display:none; top:8.3em; left:0.5em; width:16em; height:auto; padding:0.3em 0 0.3em 0; color:white; text-align:center; background-color:#dd2c0a; } .bbg_list .thumbnail img#icon { width:16em; height:9em; border:none; } .bbg_list .thumbnail img.wait { margin-top:2em; margin-left:3em; width:3.3em; height:3.3em; } .bbg_list .thumbnail .title { font-size:1.2em; height:2.4em; line-height:1.2em; overflow:hidden; } .bbg_list .thumbnail .title a { text-decoration:none; } .bbg_list .thumbnail.orange .title a { color: #fd6300; } .bbg_list .thumbnail.red .title a { color: #ff0000; } .bbg_list .thumbnail.blue .title a { color: #3600ff; } .bbg_list .thumbnail.aquamarine .title a { color: #00bebc; } .bbg_list .thumbnail.green .title a { color: #33b200; } .bbg_list .thumbnail.grey .title a { color: #666; } .bbg_list .thumbnail.rust .title a { color: #771f33; } .bbg_list .thumbnail .description { float:left; font-size:1.1em; font-weight:normal; overflow:hidden; } .bbg_list .thumbnail .duration { float:left; font-weight:normal; height:1.2em; overflow:hidden; margin-top:0.3em; } .bbg_list .thumbnail .rating { float:left; margin-left:1em; padding-top:0.3em; width:5.7em; height:1em; padding-left:1em; border-left:1px solid #303030; } .bbg_list .thumbnail.vote .rating { display:none; } .bbg_list .thumbnail .buttons { display:none; float:left; clear:both; margin-left:0; padding-top:0.3em; width:100%; } .bbg_list .thumbnail .buttons img { margin-right:0.8em; width:2.6em; height:2.6em; } .bbg_list .thumbnail .buttons img.share { width:3.9em; height:2.6em; } .bbg_list .thumbnail .buttons img.shareselected { width:3.9em; height:2.6em; } .bbg_list .thumbnail .buttons img.vote { position: absolute; bottom: 0.2em; left:0.5em; } .bbg_list .thumbnail.rate .buttons img.vote { display:none; } .bbg_list .thumbnail .buttons img.info { position: absolute; bottom: 0.2em; left:4.5em; } .bbg_list .thumbnail .buttons img.favorite { display:none; position: absolute; bottom: 0.2em; left:8.5em; } .bbg_list .thumbnail .buttons img.share { position: absolute; bottom: 0.2em; left:8.5em; } /* was right:0; */ .bbg_list .thumbnail .buttons img.voteselected { display:none; position: absolute; bottom: 0.2em; left:0.5em; } .bbg_list .thumbnail .buttons img.infoselected { display:none; position: absolute; bottom: 0.2em; left:4.5em; } .bbg_list .thumbnail .buttons img.favoriteselected { display:none; position: absolute; bottom: 0.2em; left:8.5em; } .bbg_list .thumbnail .buttons img.shareselected { display:none; position: absolute; bottom: 0.2em; left:8.5em; } /* was right:0; */ .bbg_list .thumbnail:hover .buttons { display:block; } .bbg_list .thumbnail .buttons .votebuttons:hover img.voteselected { display:block; } .bbg_list .thumbnail .buttons .infobuttons:hover img.infoselected { display:block; } .bbg_list .thumbnail .buttons .favoritebuttons:hover img.favoriteselected { display:block; } .bbg_list .thumbnail .buttons .sharebuttons:hover img.shareselected { display:block; } .bbg_list.icon.grid .thumbnail { position:absolute; width:16em; height:16em; } .bbg_list.icon #clip_template:hover { background-color:#f5f5f5; } .bbg_list.icon.grid .thumbnail .description { display:none; } .bbg_list.icon.grid .thumbnail .bkg { display:none; } .bbg_list.icon.grid #clip_template .imgbox #playbutton { display:none; position:absolute; top:3.1em; left:6.2em; width:4.5em; height:4.6em; z-index:91; } .bbg_list.icon.grid #clip_template:hover .imgbox #playbutton { display:block; position:absolute; top:3.1em; left:6.2em; width:4.5em; height:4.6em; z-index:91; } .bbg_list.list .thumbnail { float:left; left:0; right:0em; height:9em; margin-bottom:0; padding-left:1em; border:none; border-bottom:1px dotted #303030; } .bbg_list.list .thumbnail.odd { background-color: #f5f5f5; } .bbg_list.list .thumbnail.even { background-color: white; } .bbg_list.list .thumbnail .bkg { display:none; } .bbg_list.list .thumbnail .imgbox { overflow:hidden; } .bbg_list.list .thumbnail .imgbox .geoblocked { left:1em; } .bbg_list.list .thumbnail .imgbox .thanksie6, .bbg_list.list .thumbnail .imgbox .thanksvote, .bbg_list.list .thumbnail .imgbox .thanksrate { left:1em; } .bbg_list.list #clip_template .imgbox #playbutton { display:none; position:absolute; top:3.2em; left:6.8em; width:4.5em; height:4.6em; z-index:91; } .bbg_list.list #clip_template:hover .imgbox #playbutton { display:block; position:absolute; top:3.2em; left:6.8em; width:4.5em; height:4.6em; z-index:91; } .bbg_list.list .thumbnail .title { position:absolute; left:15em; top:1em; width:13em; height:4em; line-height:1em; color:#454545; } .bbg_list.list .thumbnail .description { position:absolute; left:29em; right:2em; top:1em; height:7em; line-height:1.2em; font-size:1.2em; color:#626262; } .bbg_list.list .thumbnail .duration { position:absolute; top:6em; left:18em; } .bbg_list.list .thumbnail .rating { position:absolute; top:6.2em; left:22em; width:5.7em; height:1em; } .bbg_list.list .thumbnail .buttons { display:none; position:absolute; left:17em; width:17em; } .bbg_list.list .thumbnail:hover .buttons { display:block; } .bbg_list #clip_template.geoblocked .geoblocked{ display:block; } .bbg_list #clip_template.geoblocked .buttons { display:none; } .bbg_list #clip_template.geoblocked:hover .imgbox #playbutton { display:none !important; } .bbg_list #clip_template.vote.thanks .thanksvote { display:block; } .bbg_list #clip_template.rate.thanks .thanksrate { display:block; } /* clip strip */ .bbg_clipstrip #clipstrip { position: relative; left:0px; top: 0; height:160px; background-color:#a7aaad; border-bottom:1px solid #9f9f9f; background-image:url(/img/clipstrip/bkgshade.png); background-repeat:repeat-x; } .bbg_clipstrip #clipstrip h1 { position:absolute; left:40%; top:50%; font-family:Helvetica; font-size:24px; color:#ddd; } .bbg_clipstrip #clipstrip .listheader#clipstripheader { position:absolute; left:0px; top:0px; right:0px ; min-width: 300px; border-top:1px solid #ddd; } .bbg_clipstrip #clipstrip #clipstrip_list { position:absolute; top:3px; width:auto; height:152px; left:24px; right:28px; overflow:hidden } .bbg_clipstrip #clipstrip #clipstrip_left { position:absolute; width:22px; height:100%; left:3px; bottom:0px; background:url(/img/clipstrip/arrowleft.png) no-repeat 0 center; cursor:pointer; cursor:hand; } .bbg_clipstrip #clipstrip #clipstrip_right { position:absolute; width:22px; height:100%; right:3px; bottom:0px; background:url(/img/clipstrip/arrowright.png) no-repeat 0 center; cursor:pointer; cursor:hand; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv { position:relative; display:block; height:152px; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv > #clip_template { position:relative; width:127px; height:152px; padding:2px 2px 2px 4px; font-family:Helvetica; font-size:12px; color:#303030; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv > #clip_template.selected { background: url(/img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv > #clip_template { background: url(/img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv > #clip_template:hover { background: url(/img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv > #clip_template.selected { background: url(/img/clipstrip/thumbnailborderselected.png) no-repeat left top; } .bbg_clipstrip #clipstrip .imgbox { position:relative; margin-top:17px; margin-left:0; width:128px; height:71px; overflow:hidden; margin-bottom:3px; } .bbg_clipstrip #clipstrip img#icon { position:absolute; width:128px; height:71px; border:none; } .bbg_clipstrip #clipstrip .imgbox #playbutton { position:absolute; display:none; } .bbg_clipstrip #clipstrip .imgbox .geoblocked { position:absolute; display:none; bottom:0; left:0; width:128px; height:auto; padding:3px 2px 3px 2px; color:white; text-align:center; font-size:11px; background-image:url(/img/geoblockedbkg.png); } .bbg_clipstrip #clipstrip .imgbox .addedtofavorites, .bbg_clipstrip #clipstrip .imgbox .thanksie6, .bbg_clipstrip #clipstrip .imgbox .thanksvote, .bbg_clipstrip #clipstrip .imgbox .thanksrate { position:absolute; display:none; bottom:0; left:0; width:128px; height:auto; padding:3px 2px 3px 2px; color:white; text-align:center; font-size:11px; background-color:#dd2c0a; } .bbg_clipstrip #clipstrip .imgbox .nowplaying { position:absolute; display:none; top:0; left:0; width:128px; height:auto; padding:3px 2px 3px 2px; color:white; text-align:center; font-size:11px; background-color:#ff2200; } .bbg_clipstrip #clipstrip #clip_template:hover .imgbox #playbutton { display:block; position:absolute; top:15px; left:45px; width:45px; height:46px; z-index:91; } .bbg_clipstrip #clipstrip #clip_template:hover .imgbox #playbutton img { width:45px; height:46px; } .bbg_clipstrip #clipstrip img.wait { margin-top:20px; margin-left:30px; width:33px; height:33px; } .bbg_clipstrip #clipstrip #clip_template .title { font-size:11px; height:44px; line-height:11px; width:124px; margin-bottom:5px; overflow:hidden; padding:0 2px;} .bbg_clipstrip #clipstrip #clip_template .title a { text-decoration:none !important; } .bbg_clipstrip #clipstrip #clip_template.orange .title a { color: #fd6300; } .bbg_clipstrip #clipstrip #clip_template.red .title a { color: #ff0000; } .bbg_clipstrip #clipstrip #clip_template.blue .title a { color: #3600ff; } .bbg_clipstrip #clipstrip #clip_template.aquamarine .title a { color: #00bebc; } .bbg_clipstrip #clipstrip #clip_template.green .title a { color: #33b200; } .bbg_clipstrip #clipstrip #clip_template.grey .title a { color: #666; } .bbg_clipstrip #clipstrip #clip_template.rust .title a { color: #771f33; } .bbg_clipstrip #clipstrip .description { display:none; } .bbg_clipstrip #clipstrip .duration { position:absolute; top:5px; left:10px; font-size:11px; font-weight:normal; overflow:hidden; color:#9e9e9e; } .bbg_clipstrip #clipstrip .rating { position:absolute; top:5px; left:68px; width:57px; height:10px; } .bbg_clipstrip #clipstrip .buttons { display:none; float:left; clear:both; margin-left:0; padding-top:3px; width:100%; height:20px; } .bbg_clipstrip #clipstrip .buttons img { margin-right:8px; width:20px; height:20px; } .bbg_clipstrip #clipstrip .buttons img.share { width:46px; height:20px; } .bbg_clipstrip #clipstrip .buttons img.shareselected { width:46px; height:20px; } .bbg_clipstrip #clipstrip .buttons img.favorite { display:none; position: absolute; bottom:8px; left:8px; } .bbg_clipstrip #clipstrip .buttons img.info { position: absolute; bottom:8px; left:30px; } .bbg_clipstrip #clipstrip .buttons img.share { position: absolute; bottom:8px; left:52px; } .bbg_clipstrip #clipstrip .buttons img.vote { position: absolute; bottom:8px; left:100px; } .bbg_clipstrip #clipstrip .buttons img.favoriteselected { display:none; position: absolute; bottom:8px; left:8px; } .bbg_clipstrip #clipstrip .buttons img.infoselected { display:none; position: absolute; bottom:8px; left:30px; } .bbg_clipstrip #clipstrip .buttons img.shareselected { display:none; position: absolute; bottom:8px; left:52px; } .bbg_clipstrip #clipstrip .buttons img.voteselected { display:none; position: absolute; bottom:8px; left:100px; } .bbg_clipstrip #clipstrip #clip_template:hover .buttons { display:block; } .bbg_clipstrip #clipstrip #clip_template:hover .title { height:33px; } .bbg_clipstrip #clipstrip .buttons .favoritebuttons:hover img.favoriteselected { display:none; } .bbg_clipstrip #clipstrip .buttons .infobuttons:hover img.infoselected { display:block; } .bbg_clipstrip #clipstrip .buttons .sharebuttons:hover img.shareselected { display:block; } .bbg_clipstrip #clipstrip .buttons .votebuttons:hover img.voteselected { display:block; } .bbg_clipstrip #clipstrip #clip_template.rate .buttons .votebuttons { display:none; } .bbg_clipstrip #clipstrip #clip_template.vote .rating { display:none; } .bbg_clipstrip #clipstrip #clip_template.geoblocked .geoblocked{ display:block; } .bbg_clipstrip #clipstrip #clip_template.geoblocked .buttons { display:none; } .bbg_clipstrip #clipstrip #clip_template.geoblocked .imgbox #playbutton { display:none; } .bbg_clipstrip #clipstrip #clip_template.selected .imgbox #playbutton { display:none; } .bbg_clipstrip #clipstrip #clip_template.vote.thanks .thanksvote { display:block; } .bbg_clipstrip #clipstrip #clip_template.rate.thanks .thanksrate { display:block; } .bbg_clipstrip #clipstrip #scrollbar { display:none; position:absolute; left:44px; bottom:0; right:42px; height:3px; background-color:#d1d2d4; } .bbg_clipstrip #clipstrip #scrollbar #topleft { position:absolute; left:0; top:0; width:1px; height:1px; background-color:#a7aaad; } .bbg_clipstrip #clipstrip #scrollbar #topright { position:absolute; right:0; top:0; width:1px; height:1px; background-color:#a7aaad; } .bbg_clipstrip #clipstrip #scrollbar #bottomleft { position:absolute; left:0; bottom:0; width:1px; height:1px; background-color:#a7aaad; } .bbg_clipstrip #clipstrip #scrollbar #bottomright { position:absolute; right:0; bottom:0; width:1px; height:1px; background-color:#a7aaad; } .bbg_clipstrip #clipstrip:hover #scrollbar { display:none; } /* path overide */ .bbg_clipstrip #clipstrip { background-image:url(img/clipstrip/bkgshade.png); } .bbg_list .thumbnail .imgbox .geoblocked { background-image:url(img/geoblockedbkg.png); } .bbg_clipstrip #clipstrip #clipstrip_left { background:url(img/clipstrip/arrowleft.png) no-repeat 0 center; } .bbg_clipstrip #clipstrip #clipstrip_right { background:url(img/clipstrip/arrowright.png) no-repeat 0 center; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv #clip_template.selected { background: url(img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv #clip_template { background: url(img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv #clip_template:hover { background: url(img/clipstrip/thumbnailborder.png) no-repeat left top; } .bbg_clipstrip #clipstrip #clipstrip_list .ui-scrolldiv #clip_template.selected { background: url(img/clipstrip/thumbnailborderselected.png) no-repeat left top; } .bbg_clipstrip #clipstrip { border-bottom: none; border-left: none; } /* ie6 */ #clipstrip_list { width: 100%; }