/* Theme Name: Liquid Elastic SEO Theme URI: http://www.markdrussell.com/seo-wordpress-themes/ Description: The Liquid Elastic SEO Theme is a search engine optimized, two column liquid/elastic xhtml/css layout where "liquid" means that it squeezes down to 800x600 for the fraction of people still at that resolution, and "elastic" means that the text width doesn't keep stretching at higher resolutions. In short, it is designed to look best for the majority of Internet users (at 1024x768), but it looks great to everyone else as well. This theme is also "widgetized" with 2 dynamic "sidebars" in the actual sidebar, plus four other dynamic "sidebars" in the footer, at the top of the home page, category, and archive pages. These other dynamic "sidebars" (not the 2 in the regular sidebar) default to using either Popularity Contest, if installed, or showing Recent Posts when not and they're widget-enabled so you have full control and can replace the defaults with your own widgets Licensed under Creative Commons. Version: 0.5 Author: Mark D. Russell Author URI: http://markdrussell.com */ /**********************************/ /* General */ /**********************************/ body { font-size: 85%; font-family: 'Trebuchet MS', Arial, Verdana, Sans-Serif; padding: 0; margin: 0; text-align: center; color: #000000; background-image: url(images/bg-tile.jpg); background-repeat: repeat; } /* Links */ a { color: #0D6AA6; text-decoration: none; } a:hover { text-decoration: underline; color: #f60; } /* Forms */ form { margin:0; padding:0; } input, textarea { font: 1.0em Verdana, Arial, Helvetica, sans-serif; color: #333; } /* Text */ p { margin: 10px 0; } /* Images*/ /*img { border:1px solid #EEE; padding: 1px; margin:0; }*/ img.alignleft, img.left { float:left; margin-right: 10px; margin-left: 0px; } img.alignright, img.right { float:right; margin-left: 10px; margin-right: 0px; } img.post-image { float:left; margin-right: 10px; margin-left: 0px; } /* Floats */ .clear { clear:both; overflow:hidden; display: none; } .center { text-align: center; } .fltrt { float: right; margin-left: 8px; } .fltlft { float: left; margin-right: 8px; } .alignleft { float: left; text-align: left; width: 50%; } .alignright { float: right; text-align: right; width: 50% } /**********************************/ /* Layout */ /**********************************/ /* Max-Width Blocks (See also the IE hacks in header.php) */ #header, #navbar, #content-container, #footer-top, #footer-bot { margin: 0 auto; max-width: 70em; overflow:hidden; display:block; } #bg-container { margin: 0; text-align: left; /* this overrides the text-align: center on the body element. */ background-color: #f2f2ea; } #bg-header { height: 150px; margin: 0px; padding: 20px 0px 0px 0px; background-image: url(images/bg-header.jpg); background-repeat: repeat-x; } #header { height: 100px; background-image: url(images/logo-bg.jpg); background-repeat: repeat-x; } #navbar { overflow: visible; } #content-container { height: 100%; background-color: #FFFFFF; padding:0; } #content { float:left; margin:0; padding:0; text-align:justify; } #content.narrowcolumn { width: 59%; padding: 0 4% 0 2%; } #sidebar { width: 29%; float:left; margin: 0 auto; padding: 10px 2%; border-left: 3px solid #f0f0f0; background: #fafaf7; border-top: 3px solid #e9e9e9; border-right: 3px solid #e9e9e9; border-bottom: 3px solid #e9e9e9; font-size: 0.9em; } .sidebar-top, .sidebar-main { margin:0; padding: 0; } .middle { width: 160px; margin-left: 10px; padding: 10px; float: right; } #bg-footer { background-color: #1e3c84; background-image: url(images/bg-footer.jpg); background-repeat: repeat-x; height: 100%; margin: 0; text-align:left;} /**********************************/ /* Header */ /**********************************/ #header h1 { margin: 0; padding: 10px 0; } #header-imglogo { float: left; height: 100px; width: 500px; background-image: url(); background-repeat: no-repeat; } #header-textlogo a { font: bold 18px 'Trebuchet MS', Arial, Verdana, Sans-Serif; color: #eeeeee; position: relative; left: 40px; top: 30px; } #header-description { font: 12px 'Trebuchet MS', Arial, Verdana, Sans-Serif; color: #FFFFFF; margin-left: 40px; position: relative; top: 30px; } #navbar-search { float: right; margin-top: -40px; margin-right: 20px; color: #FFFFFF; } #searchfield { height: 14px; background: #f2f2ea; } #searchfield:focus { background: #FFFFFF; } #navbar-search #searchform { } #navbar-search #searchsubmit.btn { height: 16px; width: 16px; font-weight: bold; color: #FFFFFF; } /**********************************/ /* Navbar */ /**********************************/ /* This is the old navbar, before adding the suckerfish dropdown. You can use this instead by uncommenting the following commented lines and commenting or removing the suckerfish styles that appear just below. Remember to include your own images or change the styles to css only or it won't work. */ /*#navbar ul { padding: 0px; list-style-type: none; list-style-image: none; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 20px; } #navbar li { margin: 0px; padding: 0px; display: inline; } #navbar ul li a { float: left; text-decoration:none; color: #FFFFFF; padding: 7px 1em 3px 1em; margin: 0px; text-align:center; } #navbar ul li a:hover { height: 30px; background-image: url(images/nav-hover.jpg); background-repeat: no-repeat; background-position: center top; } #navbar ul li#current a { height:30px; background-image: url(images/nav-current.jpg); background-repeat: no-repeat; background-position: center top; font-weight: bold; text-decoration: none; padding: 7px 1em 3px 1em; }*/ #suckerfishnav { background: #1D3E8D url(images/navbar-blue.png) repeat-x; height: 50px; width: 100%; font-size:16px; font-family:'Trebuchet MS', Arial, Verdana, Sans-Serif; font-weight:bold; } #suckerfishnav, #suckerfishnav ul { float:left; list-style:none; line-height:40px; padding:0; margin:0; width:100%; } #suckerfishnav a { display:block; color:#eeeeee; text-decoration:none; padding:0px 10px; } #suckerfishnav li { float:left; padding:0; } #suckerfishnav ul { position:absolute; left:-999em; height:auto; width:151px; font-weight:normal; margin:0; line-height:1; border:0; } #suckerfishnav li li { width:149px; border-bottom:1px solid #666666; border-left:1px solid #666666; border-right:1px solid #666666; font-weight:bold; font-family:verdana, sans-serif; } #suckerfishnav li li a { padding:4px 10px; width:130px; font-size:12px; color:#eeeeee; } #suckerfishnav li ul ul { margin:-21px 0 0 150px; } #suckerfishnav li li:hover { background:#466ebb; } #suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a { color: #FFFFFF; } #suckerfishnav li:hover a, #suckerfishnav li.sfhover a { color:#dddddd; } #suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a { color:#dddddd; } #suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul { left:-999em; } #suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul { left:auto; background:#1e3e8d; } #suckerfishnav li:hover, #suckerfishnav li.sfhover { background:#1e3e8d; } #suckerfishnav li:hover a, #suckerfishnav li.sfhover a { color: #FFFFFF; } /**********************************/ /* Content */ /**********************************/ #content h1, h2, h3, h4 { line-height:1.2em; text-align:left; } #content h1 { font: 1.5em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#0D6AA6; margin:0px; padding-top: 20px; text-align:left; } #content h2 { font: 1.5em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#0D6AA6; margin:0px; padding-top: 20px; text-align:left; } #content h2.pagetitle { font-size: 1.2em; color: #f90; padding: 5px 0; } #content h3 { font:normal 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#0D6AA6; text-align:left; } #content h3.popular { font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#333; margin:0; padding:0 0 0 20px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; text-transform:uppercase; text-align: left; } #content h4 { font:normal 1.0em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#0D6AA6; text-align:left; } #content blockquote { padding:0 0 0 10px; margin:5px 0px 5px 20px; color:#000; font-size: 1.0em; border-left: 5px solid #b0c4de; line-height: 1.2em; } #content p.postmetadata { clear:both; overflow:hidden; background: #f7f7f7; padding:5px 10px; line-height: 1.0em; } code { font-size:1.2em; text-align:left; margin:0; padding:0; color: #008; } #content.narrowcolumn .entrytext ul { width:75%; margin: 0 auto; } #content.narrowcolumn .entrytext ul li { padding-bottom: 5px; list-style: url(images/icons/asterisk.gif) none; } #content .post-date { font-size:1.0em; padding-left:20px; background: transparent url(images/icons/calendar.gif) no-repeat left center; padding-top: 5px; background-position:0% 5px; } #content h3.popular { background: transparent url(images/icons/star.gif) no-repeat left center; text-align: left; } /* *********************************** */ /* Navigation */ /* *********************************** */ .navigation { display: block; margin: 0; padding: 0; } .navigation a { font-size:x-small } /**********************************/ /* Sidebar */ /**********************************/ #sidebar a:hover { text-decoration:none; color: #f60; } #sidebar ul, #sidebar li, #content ul { margin: 2px 0; padding:0; list-style-type: none; } #sidebar h3 { font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#333; margin:0; padding:0 0 0 20px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; text-transform:uppercase; text-align: left; } #sidebar h3.feed { background: transparent url(images/icons/feed.gif) no-repeat left center; } #sidebar h3.aweber { background: transparent url(images/icons/email2.png) no-repeat left center; } #sidebar h3.about { background: transparent url(images/icons/user.png) no-repeat left center; } #sidebar h3.cats { background: transparent url(images/icons/category.gif) no-repeat left center; } #sidebar h3.cal { background: transparent url(images/icons/cal.png) no-repeat left center; } #sidebar h3.search { background: transparent url(images/icons/search.gif) no-repeat left center; } #sidebar h3.file { background: transparent url(images/icons/entry.gif) no-repeat left center; } #sidebar h3.meta { background: transparent url(images/icons/tools.png) no-repeat left center; } #sidebar h3.blogroll { background: transparent url(images/icons/tools.png) no-repeat left center; } #sidebar h3.comment { background: transparent url(images/icons/comment.png) no-repeat left center; } #sidebar ul { margin: 0; padding: 0; } #sidebar ul li { background: transparent; padding-left: 0px; border-bottom: 0px solid #f0f0f0; list-style: none; } #sidebar ul li ul { } #sidebar ul li ul li { padding-left: 20px; border-bottom: 1px dashed #f0f0f0; } #sidebar ul.links li { float:left; display: inline; overflow:hidden; border:none; } #sidebar ul.links li h3 { color: #666; } #sidebar ul.links li ul li { padding-left: 20px; } #sidebar img { margin:2px 0 0 0; padding:2px 0 0 0; border: none; } /**********************************/ /* Footer */ /**********************************/ #footer-top { text-align: center; height: 50px; background-image: url(images/footer-top.jpg); background-repeat: repeat-x; padding: 0; } #footer-top p { color: #DDDDDD; padding-top: 10px; } #footer-top p a { color: #FFFFFF; text-decoration: none; } #footer-top p a:hover { text-decoration: underline; } #footer-top #logos { position: relative; display: inline; padding: 0px; margin: -30px 60px 0px 0px; float: right; vertical-align: middle; } #footer-top #logos img { vertical-align: middle; margin: 0px 0px 0px 10px; padding: 0px; } #footer-bot { color: #DDDDDD; padding: 10px 0; } #footer-bot ul { float:left; margin: 0; padding: 0 2%; height: 100%; } #footer-bot ul li { width: 150px; margin: 0; padding: 0 10px; list-style:none; float: left; display: inline; } #footer-bot ul li h3 { font: bold 100% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color:#FFFFFF; margin:0; padding:0 0 0 5px; text-align: left; } #footer-bot ul li ul { text-align:left; } #footer-bot ul li ul li a { padding: 2px 0; color: #DDDDDD; font-size:85%; } #footer-bot ul li ul li a:hover { color:#FFFFFF; text-decoration: underline; font-size:95%; font-weight: bold; } #footer-bot ul li#footer-tags { width: 150px; margin: 0; padding: 0 10px; } #footer-bot ul li#footer-tags h3 { } #footer-bot ul li#footer-tags a { display:inline; color:#DDDDDD; } #footer-bot ul li#footer-tags a:hover { color:#FFFFFF; text-decoration: underline; font-size:95%; font-weight: bold; } /**********************************/ /* Calendar */ /**********************************/ #wp-calendar { width: 150px; color: #999; line-height:1.0em; } #wp-calendar caption { font-weight:bold; color: #666; line-height: 16px; text-transform: uppercase; letter-spacing: 1px; } #wp-calendar .today { background:#FBFCF4; } /* *********************************** */ /* Comments Div */ /* *********************************** */ h3#comments, h3#respond { border-top:1px solid #CCC; padding-top: 10px; padding-left: 20px; color:#0D6AA6; font-size: 1.2em; font-weight: bold; } h3#comments { background: transparent url(images/icons/comment.png) no-repeat left center; background-position:0% 12px; } h3#respond { background: transparent url(images/icons/edit.png) no-repeat left center; background-position:0% 12px; } cite { position:relative; color: #999; padding:0; margin:0; font-weight:bold; } .alt { background: #f7f7f7; } .commentbody { color: #595949; font-size: 1.0em; margin: 0 0 5px 0; padding: 10px 15px 10px 15px; background: #FAFAF5; border: 1px solid #f0f0e0; list-style:none; } .commentbody p { line-height: 1.2em; margin:0; padding:0; } .commentlink { font-size: 1.0em; } .commentlist { list-style: none; margin:0; padding:0px; } .commentcount { font:bold 2.2em Georgia, sans-serif; color: #e0e0d0; width: 520px; text-align: right; position:absolute; left:0; } .gravatar { float:left; padding: 1px; margin: 5px 5px 5px 0; background: #fff; width: 40px; height: 40px; } #recentcomments ul { border: none; } /* *********************************** */ /* Widget Specific Styles */ /* *********************************** */ #content .widget_popularity_lists h3 { background: transparent url(images/icons/star.gif) no-repeat left center; text-align: left; } #sidebar .widget_extended_categories h3 { background: transparent url(images/icons/category.gif) no-repeat left center; } #sidebar .widget_recent_entries h3 { background: transparent url(images/icons/entry.gif) no-repeat left center; } #sidebar .widget_pages h3 { background: transparent url(images/icons/page.gif) no-repeat left center; } #sidebar .widget_archive h3 { background: transparent url(images/icons/category.gif) no-repeat left center; } #sidebar .widget_tag_cloud h3 { background: transparent url(images/icons/tag.gif) no-repeat left center; } #sidebar .widget_links h3 { background: transparent url(images/icons/tools.png) no-repeat left center; } #sidebar .widget_recent_comments h3 { background: transparent url(images/icons/comment.gif) no-repeat left center; } #sidebar .subscribe_me_display_widget h3 { background: transparent url(images/icons/feed.gif) no-repeat left center; } #sidebar .subscribe_me_display_widget { text-align: center; padding-bottom: 5px; } #sidebar .bookmark_me_display_widget { text-align: center; padding-bottom: 10px; }