#post h1 { margin: 0 0 3px; font-size: 27px; } #post h2 { margin: 40px 0 10px; font-size: 20px; text-transform: uppercase; color: #FF00B0; } #post .info { padding: 5px 0; } #post .meta { display: block; font-size: 13px; color: #888; } #post .share { margin: 0; padding: 0; float: right; line-height: 15px; list-style: none; } #post .share li { float: left; padding-left: 10px; } #post .share li.facebook { padding-left: 5px; } #post .share a:link, #post .share a:visited { color: #888; text-decoration: underline; } #post .share a:hover, #post .share a:active { color: #FF00B0; } #body { font-size: 14px; line-height: 20px; } #body #image { margin: 10px 0; position: relative; } #body #image img { display: block; max-width: 610px; } #body #image.post_top img { max-height: 300px; } #body #image .categories { display: block; position: absolute; left: 2px; bottom: 2px; } #body .categories { padding: 3px 5px; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; background: #1B87DF; } #body .categories a:link, #body .categories a:visited { color: #EFEFEF; } #body .categories a:hover, #body .categories a:active { color: #000; text-decoration: none; } #body img.size-medium { margin-bottom: 5px; padding: 2px; border: 1px solid #CCC; } #body img.alignleft { float: left; margin-right: 10px; } #body img.alignright { float: right; margin-left: 10px; } #body .press-release { margin: 1em 0; padding: 10px; font-size: 11px; background: #E0E8EF; } #source { font-size: 11px; text-transform: uppercase; } #source a { font-size: 13px; text-transform: lowercase; } #tags { margin-top: 5px; padding-left: 30px; background: url('http://images.surfbang.com/images/icon-tag.png') no-repeat left 2px; } #tags a { display: block; float: left; margin: 0 10px 5px 0; padding: 5px 7px; text-align: center; text-transform: lowercase; background: #1B87DF; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #tags a:link, #tags a:visited { color: #FFF; } #tags a:hover, #tags a:active { background: #00589F; text-decoration: none; } #posts-related .post { width: 143px; margin-right: 10px; float: left; overflow: hidden; } #posts-related .post img { display: block; width: 133px; height: 75px; overflow: hidden; } #posts-related .post a { display: block; padding: 5px; font-size: 13px; text-decoration: none; color: #3483C5; } #posts-related .post a:link, #posts-related .post a:visited { background: #EFEFEF; } #posts-related .post a:hover, #posts-related .post a:active { background: #CCC; } #posts-related .post strong { display: block; padding: 3px; } .share-bar { height: 22px; margin-top: 15px; padding: 3px 5px; background: #EEE; line-height: 22px; } .share-bar strong { float: left; padding-right: 30px; text-transform: uppercase; color: #888; } .share-bar div { width: 25%; float: left; text-align: center; } .share-bar a { background-repeat: no-repeat; background-position: left center; } .share-bar div iframe { margin-top: 3px; } #embed { margin-top: 2px; } #embed .embed-code { display: block; width: 645px; height: 13px; float: left; padding: 2px; overflow: hidden; line-height: 15px; color: #333; } #gallery .options { font-size: 12px; color: #999; clear: both; } #gallery .options strong { float: right; color: #1B87DF; cursor: pointer; } #gallery .options strong:hover { color: #333; } #gallery img { display: block; width: 297px; height: 167px; float: left; margin-bottom: 10px; border: 1px solid #CCC; } #gallery .even img { margin-left: 10px; } #gallery .full-size img { width: auto; height: auto; max-width: 610px; margin-left: 0; border: 0 none; } #comments { margin-top: 10px; } #comments p { font-size: 17px; letter-spacing: .03em; } #comments .comment { margin-bottom: 5px; padding: 10px 0 15px 95px; letter-spacing: .03em; position: relative; border-bottom: 1px solid #EEE; } #comments .commented { background: #CFEBFF; } #comments .comment img { display: block; width: 80px; height: 80px; position: absolute; left: 0; top: 12px; z-index: 10; margin-right: 5px; background: #333; } #comments .comment .comment-author { padding-right: 10px; font-size: 19px; font-weight: bold; color: #111; } #comments .comment .comment-author a:link, #comments .comment .comment-author a:visited { color: #1B87DF; } #comments .comment .comment-author a:hover, #comments .comment .comment-author a:active { color: #111; } #comments .comment .comment-time { font-size: 12px; } #comments .comment .comment-time a:link, #comments .comment .comment-time a:visited { color: #888; } #comments .comment .comment-time a:hover, #comments .comment .comment-time a:active { color: #666; } #comments .comment em { font-size: 12px; color: #F33; } #comments .comment .comment-edit-link { font-size: 10px; } #comments form { font-size: 11px; color: #444; } #comments #inputs { margin-bottom: 10px; } #comments #inputs .column { width: 33%; float: left; } #comments #inputs span { font-weight: bold; font-size: 13px; color: #F33; } #comments form input, textarea { font-size: 17px; font-family: arial; letter-spacing: .03em; } #comments #inputs input { display: block; width: 85%; height: 21px; margin: 3px 0 5px; background: #FFF; border: 1px solid #999; } #comments form textarea { display: block; width: 94%; height: 150px; margin: 3px 0 10px; } #comments #submit { background: #F0F0F0; cursor: pointer; } #comments #submit:hover { color: #00589F; } #comments img.loading { margin: 0 5px; } #comments .errors { width: 90%; } #trackbacks .comment { padding: 10px 0 15px; } #trackbacks .comment p { margin: 5px 0; } #photobang { width: 770px; margin: 0 auto; } #photobang #column-left { width: 730px; } #photobang #column-right { width: 35px; padding-left: 5px; float: left; } #viewer { width: 730px; height: 608px; position: relative; overflow: hidden; } #viewer #photos { position: absolute; top: 0; left: 0; } #viewer #arrows { width: 100%; font-weight: bold; font-size: 100px; position: absolute; top: 0; left: 0; z-index: 100; background: url('http://images.surfbang.com/images/img-transparent-5x5.gif'); overflow: hidden; } #viewer #arrows div { width: 50%; height: 100%; float: left; } #viewer #arrows .active { cursor: pointer; } #viewer #arrows div a { display: none; width: 100%; height: 100%; text-decoration: none; color: #000; cursor: pointer; text-shadow: 0 0 30px #FFF; } #viewer #arrows div.hover a { display: block; } #viewer #arrows div.disabled a { display: none; } #viewer #arrows #right { text-align: right; } #photos .photo { width: 730px; float: left; text-align: center; background: #00589F; position: relative; } .photo p { height: 40px; margin: 0; padding: 10px; text-align: left; background: #00589F; letter-spacing: .02em; overflow: hidden; color: #FFF; } .credits-only .photo p { height: 15px; } .photo p span { display: block; font-size: 10px; color: #9FD6FF; position: absolute; bottom: 5px; right: 5px; } .photo p span a { text-decoration: underline; } .photo p span a:link, .photo p span a:visited { color: #9FD6FF; } .photo p span a:hover, .photo p span a:active { color: #FFF; } #photobang .selected { display: block; } #numbers { height: 548px; } #numbers ul { margin: 0; padding: 0; list-style: none; font-weight: bold; font-size: 15px; color: #FFF; } #numbers ul li { width: 30px; height: 30px; margin-bottom: 5px; background: #00589F; text-align: center; line-height: 30px; cursor: pointer; } #numbers ul li.hover { background: #1B87DF; } #numbers ul li.selected { background: #FF00B0; } #actions { height: 59px; padding: 0 5px; background: #00589F; border-top: 1px solid #FFF; } #post { clear: both; } #body { width: 615px; float: left; padding: 15px 0; } #post .box { width: 300px; float: right; padding: 10px 0; } #comments { 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; }