/* Screen Layout stylesheet for ThinkDrastic.net Created by: Olly Hodgson, 14 Oct 2004 Last Updated: Olly Hodgson, 16 Oct 2004 NOTES: - All colours must be specified as six-digit hex, eg: #000080; - Browser specific bug-fixes can be found at the end of the stylesheet. - Pages with a sidebar have a class="sidebar" on the . */ #container { font-size: 0.71em; background-color: #FFFFFF; background-image: url(/journal/wp-content/GeeDogHeaderNoSB.gif); background-position: 0 181px; background-repeat: no-repeat; color: #000000; width: 700px; margin: 0 auto 0 auto; padding: 0 0 0 0; position: relative; min-height: 295px; border-left: 10px solid #D2D2D2; border-right: 10px solid #D2D2D2; border-bottom: 10px solid #D2D2D2; } .sidebar #container { background-image: url(/journal/wp-content/GeeDogHeader.gif); } #header { background-image: url(/journal/wp-content/GeeDogHeader.jpg); width: 700px; height: 181px; } #header p, #header h1 { position: absolute; left: -3000px; } #mainnavigation { margin: 75px 0 0 0; padding: 0; } #mainnavigation ul { border-top: 1px solid #F1F1F1; border-bottom: 1px solid #F1F1F1; background-color: #F8F8F8; margin: 0; padding: 0; list-style: none; width: 100%; overflow: auto; } .sidebar #mainnavigation ul { width: 475px } #mainnavigation h2 { position: absolute; left: -3000px; } #mainnavigation li { background-color: #F8F8F8; float: left; margin: 0; padding: 0.25em 10px 0.25em 15px; } #content { padding: 0 25px 25px 25px; margin: 0; width: 650px; background-color: #FFFFFF; background-image: none; background-repeat: repeat-y; clear: both; } .sidebar #content { padding: 0 250px 25px 25px; width: 425px; background-image: url(../layout/with_sidebar/content_bg.gif); min-height: 500px; max-width: 425px; } .post { padding: 1.1em 0 0 0; margin: 0 0 3em 0; } .post .storycontent { padding-bottom: 1.1em; } .post .storytitle { border-top: 1px solid #D2D2D2; border-bottom: 1px solid #D2D2D2; background-color: #F5F5F5; padding: 0.5em; } .post .meta { margin: 0 0 0 0; border-top: 1px solid #D2D2D2; border-bottom: 1px solid #D2D2D2; padding: 0 0 0 0; background-color: #F5F5F5; clear: both; } .post .meta p { margin: 0 1.5em; padding: 0.5em 0; } .post .meta ul { margin: 0 1.5em 0 1.5em; padding: 0 0 0.5em 0; } .post .meta ul:before { content: "[ " } .post .meta ul:after { content: " ]" } .post .meta li { display: inline; margin: 0; padding: 0; } .post .meta li:before { content: " | "; } .post .meta li:first-child:before { content: ""; } h2 a:link, h2 a:visited, .storytitle a:link, .storytitle a:visited { font-weight: normal; color: Black; text-decoration: none; } h2 a:active, h2 a:hover, .storytitle a:active, .storytitle a:hover { text-decoration: underline; } .commentlist { margin: 1em 0; } .commentlist a { font-weight: normal; } .gravatar { display: inline; vertical-align: middle; width: 20px; height: 20px; background-color: #E0E0E0; } .sidebar #content textarea { max-width: 355px; height: 100px; } #sidebar { width: 225px; padding: 10px 0; margin: 0; background-color: #F1F1F1; position: absolute; top: 200px; left: 475px; z-index: 5; } #sidebar ul { margin: 0; padding: 22px 0.8em 0 0.8em; font-weight: bold; background-image: url(../layout/with_sidebar/separator.gif); background-position: top left; background-repeat: no-repeat; } #sidebar input#s, #sidebar select#cat, #sidebar select#arch { min-width: 135px; } #sidebar ul ul { margin: 0.4em 0 1em 0; font-weight: normal; background: none; padding: 0 0.8em; } #sidebar ul li { list-style: none; margin: 0; padding: 0.05em 0.25em; } #sidebar ul ul li { list-style: disc; margin: 0 0 0 0.71em; padding: 0.05em 0; border: none; } #sidebar li#calendar { margin: 0; text-align: left; } #sidebar li#calendar table { margin: 1em 0; } #sidebar li#calendar .pad { border: none; } #sidebar li#calendar caption { text-align: left; } #sidebar li.credit { text-align: left; border-bottom: none; } #sidebar form { padding: 0.15em 0.15em 0.25em 0.15em; margin: 0; } #sidebar li p { font-weight: normal; } .floatleft { margin: 0 2em 1.5em 0em; padding: 0; float: left; } .floatright { margin: 0 0.71em 1.5em 2em; padding: 0; float: right; } .pullquote { margin: 0 0.71em 0.25em 0em; padding: 0.5em 0.71em 0.5em 0; border-right: 1px solid #D2D2D2; float: left; font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; font-style: italic; letter-spacing: -0.05em; word-spacing: 0.15em; color: #000000; font-size: 1.5em; width: 7.5em; text-align: right; } .pullquote:before { content: open-quote; padding-right: 0.1em; } .pullquote:after { content: close-quote; padding-left: 0.1em; } .clearboth { clear: both; } .clearleft { clear: left; } .clearright { clear: right; } h3+div.post { margin-top: 0; padding-top: 0; border-top: none; } h3+div.post h4.storytitle { margin-top: 0; border-top: 1px solid #F5F5F5;; } /* Apply this to any container with a floated element in it to ensure the floated element gets cleared. */ .clearfix:after, #content:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfixleftonly:after { content: "."; display: block; height: 0; clear: left; visibility: hidden; } .clearfixrightonly:after { content: "."; display: block; height: 0; clear: right; visibility: hidden; } .randomgallery { padding-left: 35px !important; padding-bottom: 5px !important; } .randomgallery a { display: block; width: 130px; height: 130px; text-align: center; background-color: #F5F5F5; border: 1px solid #CDCDCD; line-height: 0.8em; } .randomgallery>a { display: table-cell; vertical-align: middle; height: 132px; } .randomgallery a:hover { background-color: #D4D4D4; border: 1px solid #ACACAC; } .randomgallery a img { border: none; } #content, .clearfix, .clearfixleftonly, .clearfixrightonly {display: inline-block;} /* Hides from IE-mac \*/ * html #content:after, * html .clearfix, * html .clearfixleftonly ,* html .clearfixrightonly {height: 1%;} #content, .clearfix, .clearfixleftonly, .clearfixrightonly {display: block;} /* End hide from IE-mac */ form dt { font-size: 1.2em; margin-top: 0.25em; } form dd { margin-bottom: 0.25em; };} /* Hides from IE-mac \*/ * html #content:after, * html .clearfix, * html .clearfixleftonly ,* html .clearfixrightonly {height: 1%;} #content, .clearfix, .clearfixleftonly, .clearfixrightonly {display: block;} /* End hide from IE-mac */ form dt { font-size: 1.2em; margin-top: 0.25em; } form dd { margin-bottom: 0.25em; }