/* Theme Name: AmberGreen Description: AmberGreen is a quick, concise theme built to display your content in style. With category controlled areas on the front page you can achieve a more magazine styled layout, perfect for keeping better control over what your visitors see. Widget ready, with a working sidebar and 3 footer area and an accordion style search area at the top of each page.
For a full demo, with working feature areas on the front page, please see our demo site here.
For a list of tutorials on this theme please see Version: 1.07 Author: Factory42 Author URI: http://www.factory42.co.uk Copyright 2008, 2009 David Knight Tags: green, black, white, dark, two-columns, fixed-width, right-sidebar, threaded-comments The CSS, XHTML, design and PHP are released under GPL: http://www.opensource.org/licenses/gpl-license.php */ /* ---------------------------------------------- HEADINGS, SITE NAME AND SLOGAN ------------------------------------------------- */ .ftitle { height:170px; margin-bottom: 5px; color: #0000FF; background-color: #99FFFF; width: 250px; overflow: hidden; } h1 { font-size: 18px; color: #6b6b6b; font-weight: bold; padding: 16px 10px 15px 10px; } h3 { padding: 16px 10px 4px 10px; font-size: 14px; color: #6b6b6b; font-weight: normal; } h2 { font-size: 16px; color: #6b6b6b; font-weight: normal; padding: 0px; margin-top: 0px; margin-left: 0px; margin-right: 0px; margin-bottom: 4px; } #header h1#logo-text a { position: absolute; float: left; margin: 0; padding: 0; font: bold 25px;; text-decoration: none; color: #fff; top: 55px; left: 35px; } #header p#slogan { position: absolute; margin: 0; padding: 0; color: #FFFFFF; letter-spacing: -0.5px; top: 75px; left: 35px; font-size: 13px; } #sidebar h3 { color: #7f931d; text-transform: none; font-size: 1.6em; width: 280px; margin-top: 10px; padding-top: 10px; padding-right: 0; padding-bottom: 2px; clear: both; list-style: none; } ul.categories { text-decoration: none; } #footer-wrap h3 { color: #7f931d; margin: 0; padding: 10px; text-transform: uppercase; text-align: center; } #central .title { font-size: 14px; clear: both; padding-top: 5px; float: left; padding-bottom: 2px; width: 550px; } /* ---------------------------------------------- LINKS ------------------------------------------------- */ a, a:visited { color: #7f931d; background: inherit; text-decoration: none; } a:hover { color: #6B6B6B; } /* ---------------------------------------------- FEATURE ------------------------------------------------- */ #featureleft { width: 300px; float: left; } #featureright { float: right; width: 540px; } #leadpic { float:left; height: 200px; width: 300px; margin: 0; padding: 0px; } .feature .title { display:block; padding-bottom:7px; font-size: 16px; } .feature { height: 200px; width: 900px; float: left; padding: 25px; clear: both; } /* ---------------------------------------------- IMAGES ------------------------------------------------- */ .galimg { width: 220px; height: 130px; margin-left: 5px; border: #7f931d solid 1px; } #buttons img { padding-top: 5px; width:25px; height: 25px; border: 0px; } #rightcol img { float:left; margin:3px 10px 4px 0; } #leftcol img { margin-bottom: 4px; display:block } img { border: 1px solid #7f931d; padding: 0px; margin: 0px; } img.float-right { margin: 5px 0px 10px 10px; } img.float-left { margin: 5px 10px 10px 0px; } img.avatar { float:left; margin-right:5px; } #dcentre img { width: 180px; height:80px; } #rss img { padding-top: 50px; border: 0px; padding-right: 5px; width: 25px; height: 25px; } /* ---------------------------------------------- ADVERTS ------------------------------------------------- */ .advert-break { width: 700px; clear: both; margin-left: auto; margin-right: auto; margin-top: 50px; } .advert { padding-top: 15px; padding-bottom: 15px; } /* ---------------------------------------------- HORIZONTAL COLUMNS ------------------------------------------------- */ #hoz-col { width: 940px; margin-left: auto; margin-right: auto; clear: both; padding-bottom: 20px; } dl.gallery { float: left; width: 231px; padding: 2px; } dl.gallery p { width: 210px; margin: auto; color: #333333; } dl.gallery dd { padding: 0px; margin: 0px; width: 225px; margin-left: 5px; margin-right: 5px; } dl.gallery dt { padding: 0px; margin: 0px; height: 140px; width: 215px; } /***************************************************************************************************************** COMMENTS *****************************************************************************************************************/ #respond { margin-top: 25px; } ol.commentlist li.comment { border:1px dotted #ccc; padding:1em; list-style-type: none; list-style-image: none; } .commentlist li.thread-odd { background-color: #eee; } .commentlist li.thread-even { background-color: #fff; } .comment-p { color: #7f931d; font-size: 12px; margin-top: 35px; padding-left: 0px; } .color1 { background-color: #fff; width: 100%; clear: both; width: 500px; padding-top: 5px; border: 1px #ccc solid; margin-bottom: 10px; } .color2 { background-color: #eee; width: 100%; width: 500px; clear: both; padding-top: 5px; border: 1px #A1A1A1 solid; margin-bottom: 10px; } ol.commentlist li.even { background-color: #eee; margin-bottom: 10px; } ol.commentlist li.odd { background-color: #fff; margin-bottom: 10px; } .reply { width: 40px; background-color: #7f931d; margin-bottom: 10px; text-align: center; margin-top: 10px; } .reply a { color: #fff; } ul.children { border: 1px solid #FFF; } ol.commentlist li.comment ul.children li.depth-2 { background-color: #eee; border: 1px #666 dotted; } ol.commentlist li.comment ul.children li.depth-3 { background-color: #fff; border: 1px #666 dotted; } ol.commentlist li.comment ul.children li.depth-4 { background-color: #eee; border: 1px #666 dotted; } ol.commentlist li.comment ul.children li.depth-5 { background-color: #fff; border: 1px #666 dotted; } /* ---------------------------------------------- P Tags ------------------------------------------------- */ .grey { color: #333333; padding-left: 10px; padding-bottom: 15px; } .feature p, #rightcol p { margin:0; } #central p { color: #333333; } #dleft p { color: #333333; padding-top: 5px; padding-left: 0px; } /* ---------------------------------------------- SIDEBAR ------------------------------------------------- */ #dsingle { width: 300px; padding-bottom: 40px; margin-right: 10px; float: right; } /* ---------------------------------------------- PAGE LAYOUT ------------------------------------------------- */ .pleft { width: 180px; float: left; padding-left: 20px; } .pright { width: 800px; padding-left: 40px; float: left; padding-right: 20px; } #rss{ float: right; width: 90px; margin-top: 3px; } body { font: 12px/170% Arial, Helvetica, sans-serif ; text-align: center; background-color: #666666; background-image: url(images/5fade.png); background-repeat: repeat-x; padding: 0px; margin: 0px; } #central { width: 600px; float: left; margin-top: 15px; margin-left: 15px; padding: 10px; } .postbox { border-top: 1px solid #ccc; padding-top: 30px; } .postbox ul, ol { padding-left: 30px; } #showhide { margin-left: auto; margin-right: auto; display: none; width: 600px; } #showhide p { color: #333; } #wrap { position: relative; width: 950px; margin: 0px auto; text-align: left; background-image: url(images/5body.png); } .content-wrap { clear: both; width: 940px; padding-top: 1px; background-image: url(images/5body.png); } #header { position: relative; width: 950px; height: 132px; padding: 0; margin: 0; background-image: url(images/green-head.png); } #sidebar { float: right; width: 280px; display: inline; margin-top: 15px; padding-right: 20px; padding-bottom: 40px; } .pagenav { width: 600px; margin-left: auto; margin-right: auto; } /* ---------------------------------------------- ALIGNMENT & CLEARING ------------------------------------------------- */ img.centered { display: block; margin-left: auto; margin-right: auto; padding: 5px; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; padding: 5px; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; padding: 5px; } .aligncenter { margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .float-left { float: left; } .float-right { float: right; } .align-left { text-align: left; } .align-right { text-align: right; } .clearer { clear: both; } .clear { display:inline-block; } .clear:after { display:block; visibility:hidden; clear:both; height:0; content: "."; } /* ---------------------------------------------- ELEMENTS ------------------------------------------------- */ /* Top Elements */ * { margin: 0; padding: 0; outline: 0 } .description { font-size: 1.3em; font-weight: bold; font-style:italic; color:#545454; margin-top:-4px; } table { border-collapse: collapse; margin: 15px 10px; } th { height: 38px; padding-left: 12px; padding-right: 12px; color: #fff; text-align: left; border-width: 1px; border-style: solid; border-color: #FFF; background-color: #7f931d; } tr { height: 34px; background: #fff; } td { padding-left: 11px; padding-right: 11px; border: 1px solid #E7F0CC; } blockquote { font-weight: normal; font-size: 14px; line-height: 1.6em; font-style: italic; font-family: "Courier New", Courier, monospace; color: #666666; clear: both; margin-top: 15px; margin-right: 10px; margin-bottom: 15px; margin-left: 10px; padding-top: 5px; padding-right: 7px; padding-bottom: 5px; padding-left: 10px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; } code { margin: 5px 0; padding: 15px; text-align: left; display: block; overflow: auto; font: 500 1em/1.5em Arial, Helvetica, sans-serif; ; /* white-space: pre; */ border: 1px solid #0099CC; background-color: #D4D4D4; } acronym { cursor: help; border-bottom: 1px dotted #895F30; } form { margin: 15px 10px; padding: 5px 10px 20px 10px; } label { display: block; margin: 8px 0 5px 0; color: #666666; } input, textarea, select { padding: 4px; color: #666666; background: #fff; border-width: 1px; border-style: solid; border-color: #d4d4d4 #ebebeb #ebebeb #d4d4d4; font: normal 11px Arial, Helvetica, sans-serif;; } textarea { width: 400px; height: 100px; display: block; } input.button { height: 20px; margin: 0; padding: 2px 3px; color: #fff; font-size: 12px; background-color: #7f931d; border: 1px solid #FFFFFF; } /* ---------------------------------------------- NAVIGATION & MENUS ------------------------------------------------- */ #nav { clear: both; padding: 0px 0px 0px 20px; margin: 0; width: 930px; height: 25px; background-image: url(images/green-menu.png); } #nav ul { float: left; list-style: none; margin: 0; } #nav ul li { display: inline; margin: 0; padding: 0; } #nav ul li a { display: block; float: left; width: auto; margin: 0; color: #EEEEEE; font: 12px Arial, Helvetica, sans-serif; text-decoration: none; padding: 3px 30px 5px 5px; } #nav ul li a:hover, #nav ul li a:active { color: #FFFFFF; } #nav ul li.current_page_item a { color: #FFFFFF; } #sidebar ul { padding: 0; text-decoration: none; margin: 5px 10px 8px 0px; } #sidebar ul li { list-style: none; margin: 0; padding-top: 10px; border: none; } #sidebar li a{ list-style: none; margin: 0; padding-top:10px; border: none; color: #684F3E; } #sidebar li { list-style: none; margin: 0; padding-top: 10px; border: none; color: #684F3E; } #sidebar ul li a { text-decoration: none; color: #684F3E; } #sidebar ul li a span { color: #A98D76; font-size: .9em; font-style: italic; font-weight: normal; } #sidebar ul li a:hover { color: #6B6B6B; background: none; } .textwidget { padding: 10px 0px 0px 10px; } /* ---------------------------------------------- SEARCHFORM ------------------------------------------------- */ .headtextbox { width: 500px; } #sidebar .searchform { background-color: transparent; border: none; margin: 0 0 0 5px; padding: 10px 0 10px 10px; width: 260px; } #sidebar .searchform p { margin: 0; padding: 0; } #sidebar .searchform input.textbox { width: 180px; height: 18px; padding: 2px; vertical-align: top; } #sidebar .searchform input.button { width: 60px; height: 24px; padding: 2px 4px; vertical-align: top; } /* ---------------------------------------------- SIDE, FOUR STORY FEATURES ------------------------------------------------- */ dl.side { float: left; width: 250px; padding: 0; margin: 10px; } dl.side dd { margin: 0; width: 300px; clear: both; } dl.side dt { margin: 0; width: 300px; height: 150px; } /* ---------------------------------------------- FOOTER ------------------------------------------------- */ #footer-wrap a { color: #FFF; } #footer-wrap { clear: both; width: 950px; border-top: 2px white solid; margin: 0; padding-top: 10px; } #footer-wrap p { padding:10px 0; color: #FFFFFF; } #footer-wrap a:hover { color: #6B6B6B; text-decoration: none; } #footer-columns { width: 900px; margin-top: 0; margin-right: auto; margin-left: auto; display: inline; clear: both; } #footer-columns ul { list-style: none; margin: 0; padding: 0; } #footer-columns li a { display: block; font-weight: normal; padding: 8px 0 8px 10px; width: 96%; color: #666666; } #footer-columns .col3, .col3-center { float: left; width: 295px; padding: 10px; } #footer-bottom { clear: both; color: #555; width: 950px; text-align: center; font-size: 0.95em; background-image: url(images/green-foot.png); height: 106px; margin-right: auto; margin-left: auto; background-color: #666666; margin-bottom: 30px; } #footer-wrap a { color: #; color: #CCCCCC; } #footer-bottom p { color: #FFF; padding-top: 70px; } /* ---------------------------------------------- POST META ------------------------------------------------- */ .post-footer { font-size: 11px; padding-bottom: 0px; } .post-footer .date{ margin: 0 10px 0 5px; } .post-footer a.comments { margin: 0 10px 0 5px; } .post-footer a.readmore { margin: 0 10px 0 5px; } .post-info { font-size: 0.95em; color: #666666; clear: both; padding: 0; width: 750px; } .post-info a, .post-info a:visited { color: 7f931d; }