/* Theme Name: Simple Pleasures Theme URI: http://www.cssetc.com/ Description: Pure CSS based custom theme Version: 1.4 Author: Robyn Karst Author URI: http://www.cssetc.com/ Tags: css, simple, clean, minimalist, red, black, widgets This is a sample stylesheet for display purposes and is copyright by CSSetc.com 2009 Feel free to take a look and if you need any CSS coding done, give me a try! */ /* ------------ begin reset = Eric Meyers Reset Reloaded = ------------ */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus {outline: 0;} body {line-height: 1;color: black;background: white;} ol, ul {list-style: none;} /* tables still need 'cellspacing="0"' in the markup */ table {border-collapse: separate;border-spacing: 0;} caption, th, td {text-align: left;font-weight: normal;} blockquote:before, blockquote:after,q:before, q:after {content: "";} blockquote, q {quotes: "" "";} /* ------------ end reset ------------*/ /* ------------ begin clearfix code ------------*/ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix {display: inline-block;} /* for IE/Mac */ /* ------------ end clearfix code ------------*/ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - page styles - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ body { margin-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 62.5%; /* resets font size 62.5% = 10px = 1em */ background: #fff; } a:link {color:#c00;text-decoration:none;} a:visited {color:#c00;text-decoration:none;} a:hover {color:#c00;text-decoration:underline;} /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - general styles - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ h1 {font-size: 2.6em;} h2 {} h3 {} h4 {} h5 {} h6 {} /* font sizes */ .bold {font-weight: bold;} .boldtext {font-weight: bold;} .text16 {font-size: 1.6em;} .text18 {font-size: 1.8em;} .text80 {font-size: 80%;} .text105 {font-size: 105%;} .text110 {font-size: 110%;} .text120 {font-size: 120%;} .text130 {font-size: 130%;} .text150 {font-size: 150%;} .space113 {letter-spacing: 1.3px;} .height160 {line-height: 160%;} /* font colors */ .red {color: #c00;} .blue {color: #00f;} .grey {color: #666;} .dkgrey {color: #333;} .dark {color: #000;} /* other font styling */ .caps {font-variant: small-caps;} .ital {font-style: italic;} .trebuchet {font-family: "Trebuchet MS", Helvetica, sans-serif;} .blue1 {font-weight: bold;color: #00f;font-family: "Comic Sans MS";} .padbottom7 {padding-bottom: 7px;} .firstline {margin-bottom: 10px;font-weight: bold;} /* backgrounds */ .litebg {background: #f2f2f2;} /* miscellaneous */ .sig { color: #c00; font: italic 1.5em "Trebuchet MS", Helvetica, sans-serif; line-height: 120%; } .test {} /* to test formats in preview */ /* links */ .redlink a {color: #c00;} /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - structure - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #pagewrap { position: relative; margin: 0; padding-bottom: 20px; width: 960px; } #leftside { position: relative; float: left; width: 245px; } #content { position: relative; float: left; width: 680px; border-left: 35px solid #000; } #footer { position: relative; left: -20px; padding: 10px 0; width: 697px; background: #f2f2f2; border: 1px solid #dbdbdb; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - left side - header + tag cloud - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #leftside #header {margin-top: 28px;} #header h1 {margin-left: 14px;width: 211px;} #header span {display: none;} #leftside #better-tag-cloud { margin: 67px auto 0; width: 180px; font-family: "Trebuchet MS", Helvetica, sans-serif; text-align: center; line-height: 250%; } #leftside #better-tag-cloud h3 {display: none;} /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - content - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #content #topmost { position: relative; left: -20px; margin-top: 20px; padding: 10px; width: 677px; font: normal 1.2em "Trebuchet MS", Helvetica, sans-serif; line-height: 1.5em; background: #f2f2f2; border: 1px solid #dbdbdb; } #content #topmost a {padding: 0 4px;background: #fff;} #content .hireme { margin: 24px 14px 20px 0; color: #666; font-size: 2.8em; line-height: 1.2em; text-align: right; } .hireme .link {padding-right: 2px;font-size: 75%;} #content #intro { /* only used on index page */ margin: 0 0 20px 157px; padding: 7px 20px; color: #333; font-size: 1.6em; text-align: justify; line-height: 1.5em; border-bottom: 2px solid #dbdbdb; border-top: 2px solid #dbdbdb; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - post styles + page styles - archive, single post - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #post-content { /* wrapper for post content */ margin: 14px 0 20px 0; min-height: 520px; height: auto; } /* for Internet Explorer */ /*\*/ * html #post-content {height: 520px;} /**/ .home #post-content {min-height: 300px;} .single #post-content { /* post wrapper on single posts */ margin: 25px 0 30px 140px; } .archive #post-content, .page #post-content { /* adjusts post wrapper on archives and pages */ margin: 45px 0 20px 140px; width: 538px; } #post-content #post-intro { margin: 0 0 20px 20px; color: #dbdbdb; font: italic 2.4em "Trebuchet MS", Helvetica, sans-serif; } #post-content .post { /* actual post styles */ float: left; margin-left: 30px; width: 310px; height: 267px; } .archive #post-content .post { margin-left: 22px; /* adjust posts on archives */ width: 247px; height: 317px; } .single #post-content .post { margin: 27px 0 10px 30px; /* adjust posts on single pages */ width: 510px; height: auto; } .page .hentry {margin-left: 30px;} /* post content on pages */ .posttop { border-bottom: 4px double #dbdbdb;} /* top of post incl title and meta */ .page .posttop {border: none;} /* adjust post top on pages */ .archive .posttop {margin-top: 2px;} /* adjust post top on archives */ .posttop h2 { /* post title */ margin-bottom: 2px; padding: 9px 4px 7px; font-size: 1.6em; font-weight: bold; border: 1px solid #dbdbdb; background: #f2f2f2; } .page .posttop h2, /* page title & single post title */ .single .posttop h2, .archive h2.pagetitle { position: relative; left: -190px; top: -25px; padding: 20px 10px; width: 676px; color: #c00; font: normal 3em "Trebuchet MS", Helvetica, sans-serif; background: #f2f2f2; border: 1px solid #dbdbdb; } .archive h2.pagetitle {left: -160px;} /* adjusts archive page title */ .single .posttop h2 {top: -32px;} /* adjusts single post page title */ .posttop .top-postmeta { /* top metadata categories */ padding: 6px 0 4px; font-size: 1.1em; line-height: 1.3em; border-top: 1px solid #dbdbdb; } .single .posttop .top-postmeta { /* adjusts single post metadata */ padding-left: 7px; background: #f2f2f2; } .entry { /* post entry styles*/ padding-top: 7px; font-size: 1.3em; line-height: 130%; text-align: justify; } .single .entry {padding: 7px 14px 0 7px;} /* adjust single post entries */ .page .entry { /* adds visual styling for page entries */ padding: 20px 14px 0 7px; border-top: 4px solid #dbdbdb; } .entry p {margin-bottom: 10px;} .entry .st-link-button {margin-top: 7px;} .post .entry a { color: #000; text-decoration: none; background: #f2f2f2; } .post .entry a:hover {color: #c00;} /* changes hover link in posts */ .post .entry a:hover {text-decoration: underline;} .post .entry a.more-link, /* read more link */ .post .st-link-button a { /* share this link */ color: #c00; font-size: 85%; text-decoration: none; background: transparent; } .post .st-link-button a:hover {text-decoration: none;} .page .entry ul {padding: 0 0 10px 24px;} /* styles for pages */ .page .entry ul li {list-style: disc outside;} .page .entry .pagemail { margin-top: 20px; font-size: 1.3em; font-weight: bold; } .page .entry .st-link-button {margin-top: 20px;} .post .postbottom { /* bottom of post */ margin-top: 7px; padding: 6px 4px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; } .postbottom .posttags { font-size: 1.1em; line-height: 1.2em; } .posttags span {font-weight: bold;} .postbottom .commentslink { /* does not appear on index */ padding-top: 4px; font-size: 1.2em; } /* for about page */ #post-197 .entry .leading { position: relative; left: -24px; margin-bottom: 14px; padding: 5px 21px 110px 10px; width: 493px; font: normal 140% "Trebuchet MS", Helvetica, sans-serif; letter-spacing: 1.2px; line-height: 160%; background: #f2f2f2; border: 1px solid #dbdbdb; } #post-197 .entry .topbox { position: absolute; top: 187px; width: 484px; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - other post content - lists - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .post .entry ul { margin: 7px 0; padding: 7px; border-top: 2px solid #8f8f8f; border-bottom: 2px solid #8f8f8f; } .post .entry ul li {padding-bottom: 10px;} .post .entry ul li a {color: #c00;text-decoration: underline;} /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - paginate navigation - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #navigation {float: right;line-height: 2.1em;} .wp-paginate {padding:0; margin:0;} .wp-paginate li {display:inline; list-style:none;} .wp-paginate .title {color:#000; margin-right:4px;} .wp-paginate a { margin-right: 4px; padding: 3px 6px; color: #000; text-align: center; text-decoration: none; background: #f2f2f2; border: 1px solid #8f8f8f; } .wp-paginate a:hover, .wp-paginate a:active {background:#dbdbdb;} .wp-paginate .gap {color:#000; margin-right:4px;} .wp-paginate .current { margin-right:4px; padding:3px 6px; color:#c00; background:#dbdbdb; border:1px solid #8f8f8f; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - commentform + comment respond - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #comments {clear:both;} h3#comment-title, #respond h3 { margin-bottom: 7px; padding: 7px; color: #c00; font: normal 2em "Trebuchet MS", Helvetica, sans-serif; background: #f2f2f2; border: 1px solid #dbdbdb; } h3#comment-title {clear: both;margin-left: 30px;} ul.commentlist {margin: 0 0 10px 30px;} /* contains all comments */ ul.commentlist li { /* contains individual comments */ margin: 0 20px; padding: 10px 10px 0; border-bottom: 4px double #dbdbdb; } ul.commentlist li.even {} /* for styling odd and even comments differently */ ul.commentlist li.odd {} ul.commentlist .commentdiv {} ul.commentlist .odd .commentdiv {} .comment-author {margin-bottom: 4px;} .comment-author a {color: #8f8f8f;} .comment-author .avatarpic {float: left;width: 40px;} .comment-author img.avatar {border: 2px solid #dbdbdb;} .comment-author .fn a {color: #c00;} .comment-author .commentmetadata { float: left; padding-bottom: 2px; width: 400px; font-size: 1.2em; line-height: 1.4em; border-bottom: 1px solid #dbdbdb; } .commentdiv .ctext { /* body of comment */ font-size: 1.3em; line-height: 1.5em; } .commentdiv .ctext p {margin-bottom: 10px;} #respond { /* container for respond form */ margin: 10px 0 0 30px; width: 510px; } #cancel-comment-reply {} #commentform-left { /* contains form */ float: left; width: 315px; } #commentform-right-loggedin, #commentform-right {float: left;width: 195px;} #commentform-right {margin-top: 85px;} /* adjusts text position if not logged in */ .comment-respond-text { /* text beside comment box */ margin-top: 20px; font-size: 1.4em; line-height: 1.5em; } form#commentform p {margin: 5px 0;} form#commentform textarea#comment { /* styles text box */ background: #f2f2f2; border: 1px solid #dbdbdb; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - page navigation bar - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #content #navbar { /* page navigation links position */ position: absolute; top: 142px; left: -18px; width: 162px; } #navbar h3 {display: none;} #navbar li { margin: 20px 0; width: 144px; height: 50px; border-left: 4px solid #c00; } #navbar li:hover, #navbar li.current_page_item {position: relative;left: 5px;} #navbar li a { display: block; /* allows links to have background and height */ height: 50px; padding-left: 5px; font: normal 2em "Trebuchet MS", Helvetica, sans-serif; color: #000; text-decoration: none; line-height: 2.7em; background: #dbdbdb; border-left: 14px solid #8f8f8f; } #navbar li a:hover, #navbar li.current_page_item a { /* current page link highlighting */ padding-left: 10px; color: #c00; border-left: 9px solid #8f8f8f; background: #c8c8c8; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - footer - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #footer #footer-links {margin: 0 0 60px 60px;} #footer-links ul {float: left;} #footer-links ul li {padding-left: 7px;border-left: 2px solid #8f8f8f;} #footer-links li.title { /* pulls link headings to the left */ position: relative; left: -8px; margin-bottom: 4px; font: normal 2em "Trebuchet MS", Helvetica, sans-serif; border-left: none; } #footer-links ul li a { font-size: 1.3em; font-weight: bold; font-style: italic; line-height: 1.5em; } #footer-links ul.footer-link-pages {margin-left: 90px;} #footer-links ul.footer-link-external {margin-left: 90px;} #footer #siteinfo { /* copyright and validation positioning */ position: absolute; right: 14px; bottom: 10px; font-size: 1.2em; text-align: right; } #footer .copy {margin: 4px 0;} /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - topnav left side fixed navigation links - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #topnav { /* right side menu fixed to browser window */ position: fixed; top: -10px; right: 0; width: 20px; z-index: 100; /* to allow links to show over other elements */ } #topnav ul li { margin: 10px 0; text-align: center; text-transform: uppercase; background: #f2f2f2; border-left: 2px solid #dbdbdb; } #topnav ul li#current {border-left: 2px solid #c00;} #topnav ul li a { display: block; padding: 10px 5px; font-family: "Trebuchet MS", Helvetica, sans-serif; font-size:1.3em; text-decoration: none; } #topnav ul li:hover {border-left: 2px solid #c00;}