#featured { width: 455px; margin: 0 0 15px 15px; padding: 10px; background: #D4EEFD; } #featured .featured { width: 100%; height: 184px; } #featured .featured img { display: block; width: 253px; height: 182px; margin-left: 10px; float: right; background: #333; border: 1px solid #44B2F2; } #featured h1 { margin: 0; font-size: 17px; } #featured h1 a:link, #featured h1 a:visited { color: #1B87DF; } #featured h1 a:hover, #featured h1 a:active { color: #FF00B0; } .featured p { margin: 3px 0 0; } #featured-tabs { margin: 10px 0 0; padding: 0; list-style: none; clear: both; } #featured-tabs li { margin-right: 10px; float: left; } #featured-tabs li#tab-3 { margin: 0; } #featured-tabs li a { display: block; width: 135px; padding: 5px; font-weight: bold; font-size: 11px; text-decoration: none; color: #1B87DF; } #featured-tabs li a:link, #featured-tabs li a:visited { background: #b8dcf1; } #featured-tabs li a:hover, #featured-tabs li a:active { background: #a4dcfd; } #featured-tabs li img { display: block; width: 133px; height: 75px; background: #333; border: 1px solid #CCC; } #featured-tabs .ui-tabs-selected a { background: #BBB; } #featured-tabs .ui-tabs-selected img { border-color: #1B87DF; } #features { margin: 0 0 15px 15px; } #features .post { padding: 5px; background: #EEE; } #column-right #sub-column-left #stalk-us { margin-bottom: 10px; } .videos { margin-bottom: 30px; } #column-right .videos h3 { margin: 0; text-transform: uppercase; } .videos .video { width: 160px; margin-bottom: 15px; position: relative; overflow: hidden; } .videos .even { margin-right: 0; } .videos .bottoms { margin-bottom: 0; } .videos .video a { display: block; font-weight: bold; font-size: 11px; text-decoration: none; color: #1B87DF; } .videos .video a img { display: block; width: 160px; height: 85px; margin-bottom: 4px; background: #333; text-indent: -9999px; } .videos .video a:link, .videos .video a:visited { } .videos .video a:hover, .videos .video a:active { } .videos .video span { display: block; width: 40px; height: 28px; margin: 0; position: absolute; top: 28px; left: 60px; background: url('http://images.surfbang.com/images/img-video-play-sprite-small.png') no-repeat; text-indent: -9999px; } .videos .video a:link span, .videos .video a:visited span { background-position: 0 0; } .videos .video a:hover span, .videos .video a:active span { background-position: -40px 0; } .videos .more-link { margin: 0; padding-top: 5px; font-size: 11px; text-align: right; clear: both; } a, a:link, a:visited { color: #FF00B0; text-decoration: none; } a:hover, a:active { text-decoration: underline; } a:focus { outline: none; } a img { border: 0 none; } h1 a:link, h1 a:visited { color: #1B87DF; } h2 a:link { color: #1B87DF; } h2 a:visited { color: #3483C5; } h2 a:hover, h2 a:active { color: #3794DF; } .widget strong { display: block; height: 20px; margin: 0; position: relative; font-size: 16px; text-transform: uppercase; color: #373737; } input, select, textarea { padding: 2px; font-size: 12px; border: 1px solid #999; } select { padding: 0; } div.pp { margin: 10px; padding: 10px; background: #000; color: #FFF; } .hide { display: none; } .show { display: block; } .showi { display: inline; } .errors { margin: 10px 0; padding: 8px; list-style: none; border: 3px solid #F33; font-weight: bold; } .errors li { padding: 3px 0 3px 15px; } .right-side { margin-right: 0 !important; } .bottom { margin-bottom: 0 !important; } .ui-stylee.ui-tabs .ui-tabs-nav { width: 100%; height: 30px; margin: 0; padding: 0; font-size: 12px; border-bottom: 1px solid #C0C0C0; list-style: none; letter-spacing: -1px; } .ui-stylee.ui-tabs .ui-tabs-nav li { height: 30px; float: left; margin: 0 5px; font-size: 13px; text-transform: uppercase; line-height: 30px; } .ui-stylee.ui-tabs .ui-tabs-nav li a { display: block; height: 28px; padding: 0 5px; font-weight: bold; text-decoration: none; background: #EEE; border: 1px solid #EEE; } .ui-stylee.ui-tabs .ui-tabs-nav li a:link,.ui-stylee.ui-tabs .ui-tabs-nav li a:visited { color: #AAA; } .ui-stylee.ui-tabs .ui-tabs-nav li a:hover, .ui-stylee.ui-tabs .ui-tabs-nav li a:active { color: #373737; } .ui-stylee.ui-tabs .ui-tabs-nav li.ui-tabs-selected a { height: 29px; background: #DDD; border-color: #C0C0C0; border-bottom-color: #DDD; color: #373737; } .ui-stylee.ui-tabs .ui-tabs-panel { background: #DDD; } .ui-tabs-hide { display: none; } #videos-list { width: 250px; float: left; } #videos-list ul { width: 250px; margin: 5px 0 0; padding: 0; list-style: none; } #videos-list ul li { margin: 0; background: #DDD; border-bottom: 1px solid #FFF; line-height: 12px; } #videos-list ul li a { display: block; padding: 8px 5px 8px 30px; font-weight: bold; font-size: 12px; text-decoration: none; background: url('http://images.surfbang.com/images/icon-video-camera.png') no-repeat left center; } #videos-list ul li a:focus { outline: none; } #videos-list ul li a:link, #videos-list ul li a:visited { color: #000; } #videos-list ul li a:hover, #videos-list ul li a:active { background-color: #C0C0C0; } .continue a { padding-right: 12px; font-size: 12px; font-weight: bold; background: url('http://images.surfbang.com/images/icon-arrow-right-pink.gif') no-repeat right center; } .comments { padding: 0; } .comments a { background: url('http://images.surfbang.com/images/icon-comments.jpg') no-repeat left center; } .rss { display: block; width: 16px; height: 16px; background: url('http://images.surfbang.com/images/icon-rss.png') no-repeat; text-indent: -9999px; } .rss:link, .rss:visited { background-position: 0 0; } .rss:hover, .rss:active { background-position: -16px 0; } .cfx:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .cfx { display: inline-table; min-width:1px;} *html .cfx { height: 1%; } .cfx { display: block; } html, body { width: 100%; height: 100%; margin: 0; padding: 0; font: normal 12px arial; color: #000; } body { background: #090209 url('http://images.surfbang.com/images/bg-surfbang-underwater.jpg') no-repeat center top; } #container { width: 960px; margin: 0 auto; } #content { background: #FFF; } #header { width: 100%; padding-top: 10px; } #logo { width: 450px; height: 116px; float: left; font-size: 82px; text-transform: uppercase; } #header .ad-banner { float: right; } #top-bar { width: 273px; height: 25px; float: right; text-align: right; line-height: 25px; color: #999; } #top-bar a { font-size: 9pt; text-transform: uppercase; } #top-bar a:link, #top-bar a:visited { color: #000; } #top-bar a:hover, #top-bar a:active { color: #08F; } #search { width: 178px; height: 23px; float: right; background: #333; border: 1px solid #B3B3B3; } #search input { width: 145px; height: 17px; float: left; padding: 3px; font-size: 13px; background: transparent; border: 0 none; color: #B3B3B3; } #search #search-submit { width: 16px; height: 16px; margin: 3px 0 0 5px; padding: 0; } #search form, #search p { margin: 0; padding: 0; } #nav { height: 30px; background: #000; } #nav ul { height: 30px; margin: 0; padding-left: 10px; position: relative; list-style: none; overflow: hidden; } #nav ul li { float: left; font-weight: bold; font-size: 14px; } #nav ul li a { display: block; height: 30px; float: left; padding: 0 14px; text-transform: uppercase; text-decoration: none; line-height: 30px; } #nav ul li a:link, #nav ul li a:visited { color: #FFF; } #nav ul li a:hover, #nav ul li a:active { color: #FF00B0; } #nav ul li.rss { position: absolute; top: 7px; right: 7px; } #columns { padding: 15px 15px 25px; } #column-left { width: 610px; float: left; } #column-right { width: 300px; float: right; } .wide-column #column-left { width: 765px; float: left; } .wide-column #column-right { width: 150px; float: right; } .column-mini { padding: 10px; } .threezies #column-left { width: 440px; } .threezies #column-right { width: 490px; } .threezies #sub-column-left { width: 160px; float: left; padding: 0 15px; } .threezies #sub-column-right { width: 300px; float: left; } #footer { width: 924px; height: 45px; margin: 0 auto; padding: 5px 15px; position: relative; background: #3483C5; border-width: 0 2px; color: #222; } #footer div { width: 450px; float: left; line-height: 12px; } #footer p { margin: 0; padding: 15px 0; } #footer #foot-right { font-size: 11px; text-align: right; } #footer a, #footer span { margin-left: 15px; color: #222; } #list-header { margin-bottom: 25px; padding: 10px; background: #EEE; } #list-header h1 { display: inline; margin: 0; text-transform: uppercase; color: #333; } #list-header #page-count { float: right; margin-top: 7px; font-size: 11px; color: #888; } #list-header #page-count span { padding: 3px 5px; font-size: 12px; background: #3483C5; color: #FFF; } .post h2 { margin: 0; font-size: 14px; } .post .category { display: block; font-size: 9px; text-align: right; text-transform: uppercase; } .post .category a { text-decoration: none; } .post .date { font-size: 11px; color: #888; } .post p { margin: 5px 0; } .post .stats { margin: 15px 0 0 0; font-size: 11px; background: #EEE; color: #AAA; } .post .stats span { margin-right: 25px; } .post .stats a:link, .post .stats a:visited { text-decoration: underline; color: #AAA; } .post .stats a:hover, .post .stats a:active { color: #FF00B0; } .wide-list .post { margin-bottom: 25px; } .wide-list h2 { font-size: 18px; } .wide-list .meta { line-height: 12px; } .wide-list .date { font-size: 10px; text-transform: uppercase; } .wide-list .category { float: right; } .wide-list .thumb { display: block; width: 438px; height: 188px; margin-bottom: 5px; border: 1px solid #CCC; } .full-width .thumb { width: 608px; } .comment-bubble { display: block; height: 25px; min-width: 25px; margin: 0 5px 2px 0; float: left; background: url('http://images.surfbang.com/images/icon-comments-right.png') no-repeat right top; } .comment-bubble a { display: block; height: 12px; padding: 5px 4px 8px 5px; background: url('http://images.surfbang.com/images/icon-comments-left.png') no-repeat left top; text-align: center; font-size: 11px; line-height: 8px; } #listing .post { margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid #DEDEDE; } #listing .post h2 { font-size: 19px; } #listing .post .thumb { width: 180px; height: 180px; float: left; margin-right: 15px; background: #EEE; } #listing .post .thumb img { display: block; width: 180px; height: 180px; } #listing .post .matrix img { width: 90px; height: 90px; float: left; } #listing .video .thumb { width: 275px; position: relative; } #listing .video .thumb img { width: 100%; background: #333 url('http://images.surfbang.com/images/no-img-thumb.jpg') no-repeat 170px 118px; } #listing .video .thumb span { display: block; width: 80px; height: 50px; position: absolute; top: 65px; left: 98px; background: url('http://images.surfbang.com/images/img-video-play-sprite.png') no-repeat; text-indent: -9999px; } #listing .video .thumb a:link span, #listing .video .thumb a:visited span { background-position: 0 0; } #listing .video .thumb a:hover span, #listing .video .thumb a:active span { background-position: -80px 0; } #listing .video .stats { padding-left: 290px; } #paginator { margin-top: 40px; clear: both; } #paginator * { margin-right: 5px; padding: 5px 8px; font-size: 14px; font-weight: bold; text-decoration: none; } #paginator a { background: #EAEAEA; } #paginator a:link, #paginator a:visited { color: #333; } #paginator a:hover, #paginator a:active, #paginator .current-page { background: #FF00B0; color: #FFF; }#column-right .column-sub { width: 115px; float: left; margin: 0 13px 15px 0; padding: 10px; } #column-right .box { width: 300px; margin-bottom: 25px; } #sub-column-right .box { width: 300px; } #column-right .border-box { width: 280px; margin-bottom: 25px; padding: 10px; background: #FAFAFA; border: 1px solid #C0C0C0; } #column-right #sub-column-left .border-box { width: 140px; } #column-right #sub-column-right .border-box { width: 280px; } #column-right h3 { margin: 0 0 10px; font-size: 14px; color: #FF00B0; } #column-right .border-box .box-link { margin: 0; padding: 0; text-align: right; } #post-box { width: 350px; } #post-box .ui-tabs-panel { width: 280px; margin: 0; padding: 10px; } #post-box .ui-tabs-panel li { padding: 6px 3px; border-bottom: 1px dashed #C0C0C0; list-style: none; } #post-box .ui-tabs-panel li > a { display: block; width: 235px; padding-left: 20px; background-repeat: no-repeat; background-position: left 1px; color: #000; } #post-box .no-category li > a { width: auto; } #post-box .arrows li a { background-image: url('http://images.surfbang.com/images/icon-arrows.gif'); } #post-box .bubble li a { background-image: url('http://images.surfbang.com/images/icon-comment-bubble.gif'); } #post-box .circles li a { background-image: url('http://images.surfbang.com/images/icon-circle.gif'); } #post-box .pagestar li a { background-image: url('http://images.surfbang.com/images/icon-star-paper.gif'); } #post-box .person li a { background-image: url('http://images.surfbang.com/images/icon-person.gif'); } #post-box .stars li a { background-image: url('http://images.surfbang.com/images/icon-star.gif'); } #post-box .thumbs li a { background-image: url('http://images.surfbang.com/images/icon-thumbs-up.gif'); } #post-box .ui-tabs-panel li span { float: right; padding: 2px; font-size: 9px; text-transform: uppercase; text-align: right; } #post-box .ui-tabs-panel li span a { background: none !important; color: #1B87DF; } #column-right #widget-twitter { width: 300px !important; padding: 0; } #column-right #widget-twitter h3 { padding: 10px 10px 0; } #column-right #widget-twitter .twtr-hd { display: none; } #column-right #widget-twitter #twtr-widget-1 .twtr-tweet a.twtr-hyperlink, #column-right #widget-twitter #twtr-widget-1 .twtr-tweet a.twtr-atreply { color: #1B87DF !important; } #column-right #stalk-us { width: 133px; margin: 0 auto 25px; text-align: center; } #column-right #stalk-us a { margin-right: 15px; } .drop-list { width: 140px; padding: 0 10px 10px; border-bottom: 3px solid #C0C0C0; } .drop-list h3 { margin: 0; padding: 0 20px 0 0; font-size: 14px; text-transform: uppercase; background: url('http://images.surfbang.com/images/icon-arrow-down-pink.gif') no-repeat right center; color: #FF00B0; } .drop-list ul { margin: 0; padding: 5px 0 0 15px; list-style: circle; } .drop-list ul li { margin-bottom: 5px; font-size: 10px; color: #666; } .drop-list ul li a { font-size: 12px; } .drop-list ul li a:link, .drop-list ul li a:visited { color: #111; } .drop-list ul li a:hover, .drop-list ul li a:active { color: #000; }  .ad-leaderboard { width: 728px; height: 90px; margin: 5px auto 15px; background: #555; overflow: hidden; } .ad-banner { width: 468px; height: 60px; background: #555; overflow: hidden; } .ad-box { width: 300px; height: 250px; margin: 0 auto; background: #333; } .ad-box a { display: block; width: 300px; height: 250px; } .ad-box a img { border: 0 none; } .ad-box-campaign { height: 265px; } .ad-box-sponsor { display: block; padding: 0 3px; height: 15px; font-size: 10px; text-align: right; line-height: 15px; background: #CCC; color: #777; } .ad-square { width: 125px; height: 125px; float: left; padding: 8px; background: #333; } .ad-skyscraper { width: 120px; height: 600px; margin: 0 auto 25px; background: #333; } .ad-skyline { width: 265px; margin: 0 auto 25px; } .ad-skyline .ad-skyscraper { margin: 0; float: left; } .ad-skyline .ad-skyscraper:first-child { margin-right: 25px; } .ad-125 { width: 125px; height: 125px; float: left; margin-bottom: 17px; margin-right: 17px; padding: 8px; background: #EFEFEF; } .square-ads { width: 328px; border: 1px solid #EEE; margin: 0 0 25px; padding: 10px 10px 0; } .square-ads a { display: block; width: 125px; height: 125px; float: left; margin: 0 14px 10px 0; } .square-ads a.promote { width: 45px; margin: 0; }