/* ***************************************************** ----------------------------------------------------- Theme Name: sg.net blogazine v2 Description: Blogazine theme. Updated version II: more blogging options, enhanced self-presentation. Version: 2.0 Author: Sebastian Greger Author URI: http://www.sebastiangreger.net/ Theme URI: http://www.sebastiangreger.net/ Tags: one-column, fixed-width sg.net blogazine II by Sebastian Greger http://localhost/ The XHTML, CSS, PHP, and images included in this theme are released under the GPL: http://www.opensource.org/licenses/gpl-license.php ----------------------------------------------------- ***************************************************** */ /* --------------------- GENERAL --------------------- */ body { opacity: 0.99999 } /* fixing the annoying Mac bug */ html { font-size:62.5%; background:#333; color:#333; } * { margin:0; padding:0; font-family:helvetica,arial,noserif; } /* font-size:1.8em; line-height:1.16666em; font-size:1.6em; line-height:1.3125em; font-size:1.4em; line-height:1.5em; font-size:1.2em; line-height:1.75em; font-size:1.1em; line-height:1.91em; /* blue: 00a1e0; red: f42d00; /* --------------------- COMMONS --------------------- */ /* --- Links --- */ a { text-decoration:none; color:#00a1e0; } a:hover { text-decoration:none; background:#00a1e0; color:white; } a img { border:0; } a[href^="http://"]:not([href*="sebastiangreger.net"]):before { content:"\2197\00A0"; } /* --- Lists --- */ ul li { list-style:none; } /* --- Hidden content --- */ .geo abbr { display:none; } .accessibility { display:none; } /* --- Common classes --- */ .centered { width:960px; margin:0 auto; } /* --------------------- HEADER & FOOTER --------------------- */ #wrapper { width:960px; margin:40px auto 0 auto; position:relative; padding-top:105px; } #header { width:240px; color:#ccc; top:47px; position:fixed; /* -moz-border-radius:5px; -webkit-border-radius:5px; */ } #header h1, #header p { font-size:1.8em; line-height:1.16666em; color:#ccc; font-weight:bold; letter-spacing:-.04em; width:220px; margin-bottom:1.16666em; padding-left:3px; } #header h1#slogan, #header p#slogan { font-size:2.8em; line-height:1.1em; width:240px; letter-spacing:-.05em; font-weight:bold; margin-bottom:20px; padding-left:0; } #header h1 a, #header p a { width:230px; color:white; display:block; -moz-border-radius:3px; -webkit-border-radius:3px; padding:3px 0 3px 2px; } #header h1 a:hover, #header p a:hover { color:white; background:#00a1e0; text-decoration:none; } #header ul { margin-top:20px; margin-right:10px; } #header li { font-size:1.8em; line-height:1.16666em; color:#ccc; letter-spacing:-.01em; } #header li a { display:block; text-transform:none; padding:2px 0 2px 3px; -moz-border-radius:3px; -webkit-border-radius:3px; letter-spacing:0.01em; } #header li a span { font-weight:bold; } #header li a:before { content:"\00BB\00A0"; } #header li a:hover { text-decoration:none; color:white; background:#00a1e0; } #header li#header_rss { margin-top:20px; } #header li#header_rss a { background:transparent url(img/icons.png) 3px -195px no-repeat; padding-left:25px; color:#ccc; font-weight:normal; } #header li#header_rss a:hover { background-color:#00a1e0; background-position:3px -95px; color:white; } #header li#header_rss a:before, #header li#header_rss a:after { content:""; } #footer { width:100%; background:#222; color:#ccc; margin-top:50px; } #footer div { width:960px; margin:0 auto; padding:20px 0; } #footer div#hcard-Sebastian-Greger { width:500px; float:left; margin-left:260px; } #footer .adr, #footer .email { display:block; } #footer .fn { font-weight:bold; } #footer p, #footer div#hcard-Sebastian-Greger ul { font-size:1.4em; line-height:1.5em; margin-bottom:1.5em; } #footer p#bottomline { display:block; margin-bottom:1.5em; width:460px; } #footer p#bottomline a { font-weight:bold; } #crosslink { background:#222; color:#eee; margin:0; padding:0; font-size:1.2em; height:25px; position:absolute; top:0; left:0; width:100%; border-bottom:2px solid #555;} #crosslink li { float:right; height:100%; margin:0; padding:0; } #crosslink li a { display:block; padding:5px 10px 0; height:20px; font-weight:bold; } #crosslink li a#crosslink_admin { color:#ccc; } #crosslink li a#crosslink_admin:hover { color:white; } #sidebar { width:170px; position:absolute; top:10px; right:0; } #content, #index, #archive { width:540px; padding:0; margin-left:240px; background:#333; min-height:750px; } #content { padding:0 20px 0; position:relative; width:500px; background:#333 url(img/bg_content_single.png) top right repeat-y; } .post-edit-link { position:absolute; right:10px; top:10px; padding:3px; color:#ccc; font-size:1.1em; z-index:10000; width:24px; text-align:center; } #index .post-edit-link, #archive .post-edit-link { top:auto; bottom:10px; z-index:99999; } /* --------------------- INDEX PAGE --------------------- */ #content_index { width:540px; padding-top:5px; background:#333; margin-top:-25px; } #content_index ul { width:540px; } #archive #content_index ul { margin-top:0; } #content_index ul li { height:170px; background:url(img/bg_content_index.png?v=2) 0 0 no-repeat; position:relative; margin-bottom:5px; cursor:pointer; } #content_index ul li:hover { background-position: 0 -170px; } #content_index ul li img { margin:10px 0 0 10px; width:520px; height:150px; } #content_index ul li h2 { position:absolute; bottom:25px; left:7px; font-size:1.8em; line-height:1.16666em; } #content_index ul li h2 a { display:block; width:380px; background:#333; padding:7px 10px; } #content_index ul li:hover h2 a { background:#00a1e0; color:white; } #content_index ul li p.date { position:absolute; top:7px; right:30px; color:#333; font-size:1.4em; line-height:1em; width:50px; text-align:center; background:#ccc; padding:10px 5px; } #content_index ul li.about { height:auto; background:#333 url(img/bg_content_single.png) top right repeat-y; cursor:auto; margin-top:10px; } #content_index ul li.about h2 { position:absolute; top:10px; left:20px; height:3px; width:500px; margin:-20px 0 0 -20px; background:url(img/bg_content_single.png) -540px 0 no-repeat; padding:20px 20px 0 20px; } #content_index ul li.about h2 span { display:none; } #content_index ul li.about p { font-size:1.4em; line-height:1.5em; padding:10px 90px 0 20px; } #content_index ul li.about .about-expand { margin-left:40px; padding-right:20px; } #content_index ul li.about p span { border-bottom:dotted 1px #333; cursor:pointer; } #content_index ul li.about p#about-intro { background:transparent url(img/click.png) 430px bottom no-repeat; } #content_index ul li.about p.about-insight-expand { background:url(img/about_insight.png) no-repeat scroll right top transparent; width:340px; padding-right:120px; } #content_index ul li.about ul { width:auto; padding:10px 0 0 20px; min-height:71px; width:440px; } #content_index ul li.about ul.about-concept-expand { background:url(img/about_sxd.png) no-repeat scroll right top transparent; } #content_index ul li.about ul.about-architecture-expand { background:url(img/about_ia.png) no-repeat scroll right top transparent; } #content_index ul li.about ul.about-interface-expand { background:url(img/about_ui.png) no-repeat scroll right top transparent; } #content_index ul li.about ul li { font-size:1.4em; line-height:1.5em; height:auto; background:none; margin:0 0 0 15px; cursor:default; list-style:square; } #content_index ul li.about p.contact { width:520px; margin:0 0 0px 0px; padding:10px 10px; background:transparent url(img/bg_content_single.png) bottom left no-repeat; } #content_index ul li.about p.contact a { background:#00a1e0; display:block; margin:0; padding:5px 10px; color:white; text-align:right; } #content_index ul li.about p.contact a:hover { background:#222; color:#00a1e0; } #content_index ul li.about p.contact a span { font-weight:bold; border:none; } #content_index ul li.external { height:85px; background-position:0 -340px; } #content_index ul li.external:hover { background-position:0 -425px; } #content_index ul li.external h2 { position:relative; top:10px; left:10px; width:500px; } #content_index ul li.external h2 a { width:375px; background:transparent url(img/icons.png) 14px -86px no-repeat; padding:10px 100px 10px 45px; height:44px; } #content_index ul li.external:hover h2 a { background-color:#00a1e0; background-position:14px -286px; color:white; } #content_index p.more { font-size:1.4em; line-height:1.75em; margin:10px 0 0 10px; width:520px; text-align:right; letter-spacing:-.02em; } #content_index p.more a { padding:5px 10px; -moz-border-radius:3px; -webkit-border-radius:3px; font-weight:bold; } #archive #content_index h1 { color:white; font-size:3.8em; line-height:1em; margin-left:10px; margin-bottom:10px; } #archive #content_index div#archive_menu { color:#eee; margin-left:10px; width:520px; margin-bottom:15px; } #archive #content_index div#archive_menu p { font-size:1.4em; line-height:1.5em; } /* --------------------- SIDEBAR --------------------- */ .sidebar_item { width:170px; margin-bottom:40px; color:#ccc; } .sidebar_item h2 { font-size:1.4em; line-height:1.5em; margin-bottom:10px; color:white; } .sidebar_item h2 a { color:#eee; } .sidebar_item h2 a:hover { color:white; } .sidebar_item h2 a[href^="http://"]:not([href*="sebastiangreger.net"]):before { content:""; } .sidebar_item p { font-size:1.2em; line-height:1.75em; } #sidebar_search { height:37px; padding-top:3px; } #sidebar_search input { border:0; padding:3px; background:#222; width:137px; color:#ccc; } #sidebar_search input#s { border:1px solid #555; } #sidebar_search input#s:hover { border-color:#00a1e0; } #sidebar_search input#searchsubmit { background:#555; font-weight:bold; width:19px; margin-left:2px; cursor:pointer; } #sidebar_search input#searchsubmit:hover { background:#00a1e0; color:white; } #sidebar_related { } #sidebar_related li { font-size:1.2em; line-height:1.3em; margin-bottom:1.3em; } #sidebar_related a { display:block; } #sidebar_related a:hover { background:transparent; } #sidebar_related img { margin-bottom:3px; } #sidebar_related span { display:block; } #sidebar_related a:hover span { background:#00a1e0; color:white; } #sidebar_twitter { } #sidebar_twitter li { font-size:1.2em; line-height:1.3em; margin-bottom:1em; background:#222 url(img/twitter.png) bottom left no-repeat; -moz-border-radius:5px; -webkit-border-radius:5px; padding:5px; word-wrap:break-word; overflow:hidden; } #sidebar_twitter li span { font-size:.9em; font-weight:bold; color:#555; display:block; margin-top:12px; padding-right:2px; text-align:right; } #sidebar_flickr { } #sidebar_flickr ul { width:180px; overflow:hidden; background:transparent; } #sidebar_flickr li { display:block; float:left; margin:0 8px 8px 0; padding:0; } #sidebar_flickr li a { display:block; width:75px; height:75px; border:3px solid #222; } #sidebar_flickr li a:hover { border-color:#00a1e0; } #sidebar_flickr li a[href^="http://"]:not([href*="sebastiangreger.net"]):before { content:""; } #sidebar_flickr li a img { width:75px; height:75px; } #sidebar_tools { height:100px; margin:0; } #sidebar_tools div { height:100px; margin:0; width:170px; } #sidebar_tools div.fixed { position:fixed; bottom:0; } #sidebar_tools p { font-size:1.2em; line-height:1.3em; background:#222; -moz-border-radius:5px; -webkit-border-radius:5px; padding:5px; } #sidebar_tools p:hover { cursor:pointer; background:#fe6d4c; color:#333; } #sidebar_tools p a { color:#fe6d4c; } #sidebar_tools p:hover a { color:white; } #sidebar_tools p a:hover { background:#fe6d4c; color:white; } /* --------------------- CONTENT --------------------- */ /* --- Headers and paragraphs --- */ #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 { font-weight:bold; } #content h1 { width:500px; margin:-20px 0 0 -20px; background:url(img/bg_content_single.png) -540px 0 no-repeat; padding:20px; letter-spacing:-0.25px; } #content h1 span { color:white; display:block; width:450px; background:#222; margin:100px 0 15px -15px; padding:7px 10px 7px 15px; font-size:1.5em; line-height:1.2em; } #content.page h1 span{ margin-top:60px; } #content h2 { font-size:1.8em; line-height:1.16666em; margin-bottom: 1.3125em; } #content h3 { font-size: 1.6em; line-height: 1.3125em; margin-bottom: 1.3125em; } #content h4, #content h5, #content h6, #content p { font-size: 1.4em; line-height: 1.5em; margin-bottom: 1.5em; } #content .geolink, #content .personlink { cursor: pointer; border-bottom: 1px dashed #333; text-decoration:none; margin-left: 1px; padding-left:15px; background: url(img/icon-geolocation.gif) bottom left no-repeat; } #content .personlink { background-image: url(img/icon-person.gif); } #content p.ingress { font-weight: bold; letter-spacing:-0.2px; } #content p.link-more { font-size:1.2em; line-height:1.75em; margin-top:1.75em; font-weight:bold; } #content p.date { position:absolute; top:7px; right:40px; color:#333; font-size:1.4em; line-height:1em; width:50px; text-align:center; background:#ccc; padding:10px 5px; } #content cite { font-style:italic; } #content blockquote { padding:0 0 0 35px; background:url(img/quote.png) top left no-repeat; font-style:italic; } #content a.pdf { background:url(img/icons.png) 0 -400px no-repeat; padding-left:22px; } /* --- Images --- */ #content .img, #content .img-l { background:#555; color:white; position:relative; width:500px; margin-bottom: 1.8em; } #content .img { background:transparent; color:#333;} #content .img-m, #content .img-s { float:right; margin-left:20px; width:240px; margin-bottom:0; background:#555; color:white; position:relative; } #content .img-s { width:110px; } #content img { display:block; } #content .img-l img { width:500px; } #content .img-m img { width:240px; } #content .img-s img { width:110px; } #content .img-l div#googlemap { margin: 0; width:498px; height:300px; border: solid 1px #555; } #content .img p, #content .img-l p, #content .img-m p, #content .img-s p { display:block; font-size:1.1em; padding:0.3em 5px; margin-bottom:0; } #content .img p { padding:0.3em 0; margin-bottom:0; } #content .img a[href^="http://"]:not([href*="sebastiangreger.net"]):before, #content .img-l a[href^="http://"]:not([href*="sebastiangreger.net"]):before, #content .img-m a[href^="http://"]:not([href*="sebastiangreger.net"]):before, #content .img-s a[href^="http://"]:not([href*="sebastiangreger.net"]):before { content:""; } #content .img-l .geolink, #content .img-m .geolink, #content .img-s .geolink { margin-left:5px; } /* --- Code examples etc. --- */ /* below: check for margins etc. */ #content code { display:block; font-family:courier new,courier,monospace; font-size:1.1em; border:1px solid #555; overflow:auto; /*overflow-x:scroll;*/ color:#333; white-space:pre; padding:.5em; } #content div.code-result { border:1px solid #555; padding:1em; font-size:1.2em; } #content div.code-result * { font-size:1em; } #content p.code-caption { display:block; font-size:1.1em; padding:0.3em 5px; margin-bottom:1.8em; background:#555; color:white; } #content p.code-caption a { color:white; } #content p.code-caption a.license { float:right; display:block; margin-left:10px; } #content p.code-caption a.license::after { content:""; } #content p.code-caption a.cc-by { width:88px; height:31px; background:url(img/cc_by_88x31.png) top left no-repeat; } #content p.code-caption a.license span { display:none; } /* above: check for margins etc. */ /* --- Info boxes and special links --- */ #content .info-box-l, #content .info-box-m ,#content .info-box-s, #content #multipage-navi, #content #multipage-bottomnavi { width:500px;border-top: 2px solid #555;border-bottom: 2px solid #555; padding:1.2em 0 0; margin:0 0 1.2em 0; float:right; color:#555; } #content .info-box-m, #content #multipage-navi { width:240px; margin-left:20px; } #content .info-box-s { width:110px; margin-left:20px; } #content #multipage-bottomnavi li { list-style-type:none; margin-left:0; width:205px; float:left; } #content #multipage-bottomnavi li.last { margin-left:20px; text-align:right; } /* --- Lists --- */ #content ul, #content ol { margin-bottom: 2.1em; } #content li { list-style-type:square; margin-left:15px; font-size:1.4em; line-height:1.5em; } #content ol li { list-style-type:decimal; margin-left:20px; } ul#content li { font-size:1em; } #content ul ul, #content ol ol { margin-bottom:0; } #content li li { font-size:1em; } #content ul.nobullets, #content ul.bibliography { margin-bottom: 0; } #content ul.nobullets li, #content ul.bibliography li { list-style-type:none; margin-left:0; margin-bottom: 1.2em; } #content ul.bibliography li { margin-left:20px; text-indent:-20px; } #content ul.bookmarks, #content ul.thumblist { margin-bottom:0; } #content ul.bookmarks li, #content ul.thumblist li { margin-bottom:2.1em; position:relative; font-size:1em; line-height:1em; list-style-type:none; margin-left:0; } #content ul.bookmarks h2 { font-size:1.4em; line-height:1.5em; font-weight:normal; margin-bottom:0; } #content ul.bookmarks li.ajaxed, #content ul.thumblist li { min-height:8.4em; } #content ul.bookmarks .ajaxed h2, #content ul.thumblist h2 { margin-left:130px; } #content ul.thumblist h3 { margin-left:130px; } #content ul.bookmarks .ajaxed p, #content ul.thumblist p { margin-left:130px; } #content ul.bookmarks .ajaxed p { margin-bottom:0; } #content ul.bookmarks .ajaxed img, #content ul.thumblist img { position:absolute; top:3px; left:0; } /* --- Footnotes--- */ /* below: check for margins etc. */ #content a[rel=footnote], #content a[rev=footnote] { vertical-align:super; line-height:0; font-size:.8em;} #content h2.content-footnotes { font-size:1.1em; line-height:1.91em; margin-bottom:0; } #content #footnotes { margin-bottom:2.1em; } #content #footnotes li { font-size:1.1em; line-height:1.91em; list-style-type:decimal; } /* above: check for margins etc. */ /* --------------------- COMMENTS --------------------- */ #comments { width:540px; margin-left:240px; } #comments h2 { font-size:1.8em; line-height:1.16666em; color:#eee; margin:20px 0 0 10px; } #comments div#comments_form { padding-bottom:10px; background:transparent url(img/bg_content_single.png) bottom left no-repeat; } #comments form, #comments div#comments_closed { background:url(img/bg_content_single.png) top right repeat-y; padding:10px 20px 12px; border-top:dashed 2px #333; } #comments form h2 { font-size:1.8em; line-height:1.16666em; margin:0 0 10px; color:#333; } #comments form p, #comments div#comments_closed p { font-size:1.4em; line-height:1.5em; width:500px; margin:0; padding:0; } #comments form em, #comments div#comments_closed em { font-style:normal; font-weight:bold; } #comments form span { border-bottom:solid 1px #333; width:210px; background:#eee; padding-right:40px; } #comments form input { width:210px; font-size:1em; line-height:1em; border:0; border-bottom:solid 1px #333; background:#eee; } #comments form textarea { width:492px; height:100px; font-size:1.4em; line-height:1.5em; border:solid 1px #333; padding:3px; background:#eee; margin-top:5px; } #comments form input:hover, #comments form textarea:hover { border-color:#fe6d4c; } #comments form input#submit { width:500px; font-size:1.4em; line-height:1.5em; border:solid 1px #333; padding:3px 0; font-weight:bold; margin-top:10px; background:#333; color:#fe6d4c; } #comments form input#submit:hover { border-color:#fe6d4c; background:#fe6d4c; color:white; } #comments form span#tw-user { display:block; border:0; width:500px; background:transparent; padding:0; position:relative; } #comments form span#tw-user img { width:40px; height:40px; position:absolute; top:0; left:0; } #comments form span#tw-user span#tw-msg { display:block; margin-left:50px; min-height:40px; border:0; width:450px; background:transparent; padding:0; font-size:1.4em; line-height:1.5em; } #comments ul { width:520px; color:#ccc; margin-left:10px; } #comments ul li { position:relative; margin:20px 0 25px; padding:10px 10px 30px 60px; background:#222; -moz-border-radius:5px; -webkit-border-radius:5px; } #comments ul li.authcomment { background:#444 url(img/authcomment.png) 0 8px no-repeat; } #comments ul h3 { font-size:1.6em; line-height:1.3125em; width:295px; } #comments ul p { font-size:1.4em; line-height:1.5em; width:450px; } #comments ul p.awaiting_moderation { font-size:1.1em; line-height:1.91em; font-style:italic; color:orange; } #comments ul p.awaiting_moderation em { font-weight:bold; font-style:italic; } #comments ul img.avatar { width:40px; position:absolute; top:10px; left:10px; } #comments ul li.authcomment img.avatar { display:none; } #comments ul p.date { color:#555; font-size:1.1em; line-height:1.91em; width:150px; position:absolute; bottom:10px; right:10px; text-align:right; font-weight:bold; } #comments ul li.authcomment p.date { color:#222; } #comments ul a.comment-edit-link { position:absolute; top:10px; right:10px; text-align:right; font-size:1.1em; line-height:1.91em; width:24px; text-align:center; color:#ccc; } /* --------------------- NOTES PAGE --------------------- */ #notes_index { width:540px; padding-top:5px; background:#333; margin-top:-20px; } #notes_index ul { width:540px; } #notes_index ul li { padding:0 20px 0; position:relative; width:500px; background:#333 url(img/bg_content_single.png) top right repeat-y; margin:5px 0 20px; } #notes_index h2 { width:500px; margin:-20px 0 0 -20px; background:url(img/bg_content_single.png) -540px 0 no-repeat; padding:20px 20px 0 20px; } #notes_index h2 span { display:none; } #notes_index p { font-size: 1.4em; line-height: 1.5em; margin-bottom: 1.5em; } #notes_index p.date { font-size:1.1em; line-height:1.1em; height:20px; width:500px; margin:0 -20px 0 -20px; padding:0 20px; background:transparent url(img/bg_content_single.png) bottom left no-repeat; } #notes_index p.date span { position:absolute; bottom:20px; right:20px; font-weight:bold; color:#555; display:block; } #notes_index li.tweets p.date span { bottom:10px; height:20px; padding-top:10px; padding-left:50px; background:transparent url(img/twitter_white.png) bottom left no-repeat; } #notes_index div#archive_menu { background:#222; -moz-border-radius:5px; -webkit-border-radius:5px; width:510px; margin:0 5px 40px; padding:10px; } #notes_index div#archive_menu h1 { font-size:1.8em; line-height:1.16666em; color:#eee; margin-bottom:.5em; } #notes_index div#archive_menu p { font-size:1.4em; line-height:1.5em; margin-bottom:0; color:#eee; } #notes_index div#archive_menu p a { font-weight:bold; } /* --------------------- ADD THIS TOOLBOX --------------------- */ #content p.addthis_toolbox { font-size:1.2em; line-height:16px; margin-top:0; padding-top:20px; } #content p.addthis_toolbox a { padding:3px 2px; margin-right:5px; background:#eee; -moz-border-radius:3px; -webkit-border-radius:3px; } #content p.addthis_toolbox a.at300m { margin-right:0; } #content p.addthis_toolbox a:hover { background:#00a1e0; } #content p.addthis_toolbox a.at300b span.at300bs { padding-right:2px; } /* --------------------- SLIMBOX 2 --------------------- */ #lbOverlay { position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background-color: #000; cursor: pointer; } #lbCenter, #lbBottomContainer { position: absolute; z-index: 9999; overflow: hidden; background-color: #fff; } .lbLoading { background: #fff url(img/loading.gif) no-repeat center; } #lbImage { position: absolute; left: 0; top: 0; border: 10px solid #fff; background-repeat: no-repeat; } #lbPrevLink, #lbNextLink { display: block; position: absolute; top: 0; width: 50%; outline: none; } #lbPrevLink { left: 0; } #lbPrevLink:hover { background: transparent url(img/prevlabel.gif) no-repeat 0 15%; } #lbNextLink { right: 0; } #lbNextLink:hover { background: transparent url(img/nextlabel.gif) no-repeat 100% 15%; } #lbBottom { font-size:1.2em; line-height:1.75em; color: #333; text-align: left; border: 10px solid #fff; border-top-style: none; } #lbCloseLink { display: block; float: right; width: 66px; height: 22px; background: transparent url(img/closelabel.gif) no-repeat center; margin: 5px 0; outline: none; } #lbCaption, #lbNumber { margin-right: 71px; } #lbCaption { font-weight: bold; } /* --------------------- CLEARFIX HACK --------------------- */ .clearfix {display: inline-table;} .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* Hide from IE/Mac \*/ * html .clearfix {height: 1%;} .clearfix{display: block; clear: both;} /* Unhide */