/******************************************** AUTHOR: Erwin Aligam WEBSITE: http://www.styleshout.com/ TEMPLATE NAME: PixelGreen TEMPLATE CODE: S-0010 VERSION: 1.2 LAST MODIFIED: June-05-2007 *******************************************/ /******************************************** HTML ELEMENTS ********************************************/ /* top elements */ * { padding: 0; margin: 0; } body { margin: 0; padding: 0; font: normal 83%/1.5em 'Trebuchet MS', Tahoma, sans-serif; color: #555; background: #FFF url(pundiebg.jpg) repeat-x; text-align: center; } /* links */ a { background: inherit; color: #1F73DA; text-decoration: none; } a:hover { background: inherit; color: #1F73DA; text-decoration: underline; } /* headers */ h1, h2, h3 { font: bold 1em 'Trebuchet MS', Tahoma, Sans-serif; } h1 { font-size: 1.4em; color: #1F73DA; } h2 { font-size: 1.2em; text-transform: uppercase; } h3 { font-size: 1.2em; } p, h1, h2, h3 { margin: 10px 15px; } ul, ol { margin: 10px 30px; padding: 0 15px; } /* images */ img { border: 1px solid #DADADA; padding: 5px; background: #FAFAFA; } img.float-right { margin: 5px 0px 5px 15px; } img.float-left { margin: 5px 15px 5px 0px; } code { margin: 5px 0; padding: 10px; text-align: left; display: block; overflow: auto; font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace; /* white-space: pre; */ background: #FAFAFA; border: 1px solid #f2f2f2; border-left: 3px solid #72A545; } acronym { cursor: help; border-bottom: 1px solid #777; } blockquote { margin: 15px; padding: 0 0 0 20px; background-color: #FAFAFA; background-position: 8px 10px; border: 1px solid #f2f2f2; border-left: 3px solid #72A545; font: bold 1.2em/1.5em "Trebuchet MS", Tahoma, sans-serif; color: #666666; } /* start - table */ table { border-collapse: collapse; margin: 10px 15px; } th strong { color: #fff; } th { background: #1F73DA; height: 29px; padding-left: 11px; padding-right: 11px; color: #fff; text-align: left; border-left: 1px solid #B6D59A; border-bottom: solid 2px #FFF; } tr { height: 30px; } td { padding-left: 11px; padding-right: 11px; /* border-left: 1px solid #FFE1C3; */ border-left: 1px solid #FFF; border-bottom: solid 1px #ffffff; } td.first,th.first { border-left: 0px; } tr.row-a { background: #F8F8F8; } tr.row-b { background: #EFEFEF; } /* end - table */ /* form elements */ form { margin:10px 15px; padding: 0; border: 1px solid #f2f2f2; background-color: #FAFAFA; } label { display:block; font-weight:bold; margin:5px 0; } input { padding: 2px; border:1px solid #eee; font: normal 1em "Trebuchet MS", Tahoma, sans-serif; color:#777; } textarea { width:400px; padding:2px; font: normal 1em "Trebuchet MS", Tahoma, sans-serif; border:1px solid #eee; height:100px; display:block; color:#777; } input.button { margin: 0; font: bold 1em Arial, Sans-serif; background: #FFF url(gradientbg.jpg) repeat-x; padding: 2px 3px; color: #333; border: 1px solid #DADADA; } /* search form */ .searchform { background-color: transparent; border: none; margin: 0; padding: 0; } .searchform p { margin: 10px; padding: 0; } .searchform input.textbox { width: 130px; color: #333; height: 20px; padding: 2px; vertical-align: top; } .searchform input.button { font: bold 12px Arial, Sans-serif; color: #333; width: 60px; height: 26px; border: 1px solid #DADADA; padding: 3px 5px; vertical-align: top; } /*********************** LAYOUT ************************/ #header-content, #content, #footer-content { width: 760px; } /* header */ #header { height: 100px; text-align: left; } #header-content { margin: 0 auto; padding: 0; position: relative; } #header-content h1#logo { position: absolute; font: bold 45px 'Trebuchet MS', Sans-serif; letter-spacing: -2px; color: #FFF; margin: 0; padding: 0; /* change the values of left and top to adjust the position of the logo */ top: 0; left: 0px; } #header-content h1#logo a { text-decoration: none; color: #FFF; } #header-content #slogan { position: absolute; font: bold 12px 'Trebuchet Ms', Sans-serif; text-transform: none; color: #FFF; margin: 0; padding: 0; /* change the values of left and top to adjust the position of the slogan */ top: 55px; left: 40px; } /* header menu */ #header-content ul { position: absolute; right: 30px; top: 85px; font: bolder 1.3em 'Trebuchet MS', sans-serif; font-size: 99%; color: #FFF; list-style: none; margin: 0; padding: 0; } #header-content li { display: inline; } #header-content li a { float: left; display: block; padding: 1px 5px; color: #FFF; background-color: #333; text-decoration: none; border-right: 1px solid #272727; } #header-content li a:hover { background: #1F73DA; color: #FFF; } #header-content li a#current { background: #1F73DA; color: #FFF; } /* header photo */ .headerphoto { margin: 0 auto; width: 770px; height: 229px; padding: 15px 10px 10px 10px; background: #FFF url(headerphoto.jpg) no-repeat center; } /* contact photo */ .contactphoto { margin: 0 auto; width: 770px; height: 279px; padding: 15px 10px 10px 10px; background: #FFF url(contactphoto.jpg) no-repeat center; } /* content */ #content-wrap { width: 100%; } #content { text-align: left; padding: 0; margin: 0 auto; } /* sidebar */ #sidebar { float: left; width: 17%; margin: 0 10px 10px 0; padding: 0; } #sidebar h1 { padding: 0px 0px 0px 10px; margin: 0; font: bold 1.3em 'Trebuchet MS', Tahoma, Sans-serif; } .sidebox { background: #F5F5F5; border: 1px solid #EFEDED; margin-bottom: 10px; } /* sidebar menu */ #sidebar ul.sidemenu { list-style:none; margin: 0px 0 0px 0; padding: 0; background: #F5F5F5; } #sidebar ul.sidemenu li { font: normal 0.8em 'Trebuchet MS', Tahoma, Sans-serif; padding: 0px 0px background: #F2F2F2; } #sidebar ul.sidemenu a { display:block; font-weight:normal; color: #333; height: 1.0em; padding: 1.0em 0 .3em 10px; line-height: 0.5em; text-decoration:none; } #sidebar ul.sidemenu a:hover { padding: 1.0em 0 .3em 5px; border-left: 5px solid #1F73DA; color: #1F73DA; } #sidebar li a#current { background: #1F73DA; color: #FFF; } /* sidebarright */ #sidebarright { float: right; width: 17%; margin: 0 0 0 0; padding: 0; } #sidebarright h1 { padding: 0px 0px 0px 10px; margin: 0; font: bold 1.3em 'Trebuchet MS', Tahoma, Sans-serif; } .sidebox { background: #FFF url(gradientbg.jpg) repeat-x; border: 1px solid #EFEDED; margin-bottom: 10px; } /* sidebar menu */ #sidebarright ul.sidemenu { list-style:none; margin: 10px 0 15px 0; padding: 0; background: #F2F2F2; } #sidebarright ul.sidemenu li { padding: 0px 10px; } #sidebarright ul.sidemenu a { display:block; font-weight:normal; color: #333; height: 1.5em; padding:.3em 0 .3em 15px; line-height: 1.5em; border-bottom: 1px dashed #D4D4D4; text-decoration:none; } #sidebarright ul.sidemenu a.top{ border-top: 1px dashed #D4D4D4; } #sidebarright ul.sidemenu a:hover { padding: .3em 0 .3em 10px; border-left: 5px solid #1F73DA; color: #1F73DA; } #sidebarright li a#current { background: #1F73DA; color: #FFF; } /* main */ #main { float: left; width: 63%; margin: 0 0 0 0; padding: 0; } #main h1 { padding: 10px 0px 0px 5px; margin: 0 0 0 10px; border-bottom: 1px solid #f2f2f2; font: normal 1.5em 'Trebuchet MS', Tahoma, Sans-serif; } #main ul li { list-style-image: url(pundiebullet.gif); } .post { margin: 0; padding: 0; background: #FFF url(gradientbg.jpg) repeat-x; border: 1px solid #EFEDED; } .post .post-footer { background-color: #FAFAFA; border: 1px solid #f2f2f2; padding: 5px; margin-top: 20px; font-size: 95%; } .post .post-footer .date { background: url('clock.gif') no-repeat 0 center; padding-left: 20px; margin: 0 10px 0 5px; } .post .post-footer .comments { background: url('comment.gif') no-repeat 0 center; padding-left: 20px; margin: 0 10px 0 5px; } .post .post-footer .readmore { background: url('page.gif') no-repeat 0 center; padding-left: 20px; margin: 0 10px 0 5px; } /* footer */ #footer { clear: both; margin: 0; padding: 0; font: normal .95em/1.6em 'Trebuchet MS', Tahoma, Arial, sans-serif; text-align: left; } #footer h1, #footer p { margin-left: 0; } #footer-content { border-top: 1px solid #EAEAEA; margin: 0 auto; padding-left: 15px; } #footer-content a { text-decoration: none; color: #777; } #footer-content a:hover { text-decoration: underline; color: #333; } #footer-content ul { list-style: none; margin: 0; padding: 0; } #footer-content .col { width: 32%; padding: 0 5px 30px 0; } #footer-content .col2 { width: 33%; padding: 0 0 30px 0; } /* alignment classes */ .float-left { float: left; } .float-right { float: right; } .align-left { text-align: left; } .align-right { text-align: right; } /* additional classes */ .clear { clear: both; } .gray { color: #BFBFBF; }