/******************************************** AUTHOR: Erwin Aligam WEBSITE: http://www.styleshout.com/ TEMPLATE NAME: Bright Side of Life TEMPLATE CODE: S-0005 VERSION: 1.0 *******************************************/ /******************************************** HTML ELEMENTS ********************************************/ /* top elements */ * { padding: 0; margin: 0; } #bg { position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; z-index:-1; } #bg img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; min-width: 50%; min-height: 50%; } body { margin: 0; padding: 0; font: .70em/1.5em Verdana, Tahoma, Helvetica, sans-serif; color: #ffffcc; text-align: center; } /* links */ a { color: #4284B0; background-color: inherit; text-decoration: none; } a:hover { color: #9EC068; background-color: inherit; } /* headers */ h1, h2, h3 { font: bold 1em 'Trebuchet MS', Arial, Sans-serif; } h1 { font-size: 2.5em;text-align: center; } h2 { font-size: 1.4em; text-transform:uppercase;text-align: center; } h3 { font-size: 1.3em;text-align: justify; } p, h1, h2, h3 { margin: 10px 15px; } ul, ol { margin: 10px 30px; padding: 0 15px; color: #fff; } ul span, ol span { color: #fff; } /* imagess */ img { border: 2px solid #CCC; } img.no-border { border: none; } img.float-right { margin: 5px 0px 5px 15px; } img.float-left { margin: 5px 15px 5px 0px; } a img { border: 2px solid #568EB6; } a:hover img { border: 2px solid #CCC !important; /* IE fix*/ border: 2px solid #568EB6; } 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: 4px solid #4284B0; } acronym { cursor: help; border-bottom: 1px solid #777; } blockquote { margin: 15px; padding: 0 0 0 20px; background: #FAFAFA; border: 1px solid #f2f2f2; border-left: 4px solid #4284B0; color: #4284B0; font: bold 1.2em/1.5em Georgia, 'Bookman Old Style', Serif; } /*********************** LAYOUT ************************/ #wrap { background: #FFF; width: 1050px; height: 100%; margin: 0 auto; text-align: left; color: #ffffcc; } #content-wrap { clear: both; margin-left:auto; margin-right:auto; padding: 0; width: 1050px; background: #2b0d03; /* Old browsers */ background: -moz-linear-gradient(left, #2b0d03 2%, #d47920 50%, #83300f 99%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(2%,#2b0d03), color-stop(50%,#d47920), color-stop(99%,#83300f)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, #2b0d03 2%,#d47920 50%,#83300f 99%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, #2b0d03 2%,#d47920 50%,#83300f 99%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, #2b0d03 2%,#d47920 50%,#83300f 99%); /* IE10+ */ background: linear-gradient(to right, #2b0d03 2%,#d47920 50%,#83300f 99%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b0d03', endColorstr='#83300f',GradientType=1 ); /* IE6-9 */ } /* header */ #header { position: relative; height: 85px; background: #000 url(../images/headerbg.gif) repeat-x 0% 100%; } #header h1#logo { position: absolute; margin: 0; padding: 0; font: bolder 4.1em 'Trebuchet MS', Arial, Sans-serif; letter-spacing: -2px; text-transform: lowercase; top: 0; left: 5px; } #header h2#slogan { position: absolute; top:37px; left: 95px; color: #666666; text-indent: 0px; font: bold 11px Tahoma, 'trebuchet MS', Sans-serif; text-transform: none; } #header form.searchform { position: absolute; top: 0; right: -12px; } /* main */ #main { float: left; margin-left: 15px; padding: 0; width: 50%; } .post-footer { background-color: #FAFAFA; padding: 5px; margin: 20px 15px 0 15px; border: 1px solid #f2f2f2; font-size: 95%; } .post-footer .date { background: url(../images/clock.gif) no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .comments { background: url(../images/comment.gif) no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .readmore { background: url(../images/page.gif) no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } /* sidebar */ #sidebar { float: left; width: 20%; margin: 0; padding: 0; display: inline; color: #ffffcc; } #sidebar ul.sidemenu { list-style:none; margin:10px 0 10px 15px; padding:0; } #sidebar ul.sidemenu li { margin-bottom:1px; border: 1px solid #220902; } #sidebar ul.sidemenu a { display:block; font-weight:bold; text-decoration:none; color: #ffffcc; padding:2px 5px 2px 10px; background: #220902; border-left:4px solid #CCC; min-height:18px; } * html body #sidebar ul.sidemenu a { height: 18px; } #sidebar ul.sidemenu a:hover { padding:2px 5px 2px 10px; background: #bf7025; color: #339900; border-left:4px solid #5d1b09; } /* rightbar */ #rightbar { float: right; width: 20%; padding: 0; margin:0; font: bold 14px Tahoma, 'trebuchet MS', Sans-serif; margin-right:50px; } /* Footer */ #footer { clear: both; color: #FFF; background: #8a4208; border-top: 5px solid #401606; margin: 0; padding: 0; height: 50px; font-size: 95%; } #footer a { text-decoration: none; font-weight: bold; color: #FFF; } #footer .footer-left{ float: left; width: 65%; } #footer .footer-right{ float: right; width: 30%; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #header a span {float:none;} /* End IE5-Mac hack */ #header a:hover span { color:#FFF; } #header a:hover { background-position:0% -42px; } #header a:hover span { background-position:100% -42px; } #header #current a { background-position:0% -42px; color: #FFF; } #header #current a span { background-position:100% -42px; color: #FFF; } /* end menu tabs */ /* 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; } .green { color: #9EC630; } .gray { color: #BFBFBF; } /*table for timings */ .CSSTableGenerator { margin:0px;padding:0px; width:100%; -moz-border-radius-bottomleft:17px; -webkit-border-bottom-left-radius:17px; border-bottom-left-radius:17px; -moz-border-radius-bottomright:17px; -webkit-border-bottom-right-radius:17px; border-bottom-right-radius:17px; -moz-border-radius-topright:17px; -webkit-border-top-right-radius:17px; border-top-right-radius:17px; -moz-border-radius-topleft:17px; -webkit-border-top-left-radius:17px; border-top-left-radius:17px; }.CSSTableGenerator table{ border-collapse: collapse; border-spacing: 0; width:100%; height:100%; padding:0px; }.CSSTableGenerator tr:last-child td:last-child { -moz-border-radius-bottomright:17px; -webkit-border-bottom-right-radius:17px; border-bottom-right-radius:17px; } .CSSTableGenerator table tr:first-child td:first-child { -moz-border-radius-topleft:17px; -webkit-border-top-left-radius:17px; border-top-left-radius:17px; } .CSSTableGenerator table tr:first-child td:last-child { -moz-border-radius-topright:17px; -webkit-border-top-right-radius:17px; border-top-right-radius:17px; }.CSSTableGenerator tr:last-child td:first-child{ -moz-border-radius-bottomleft:17px; -webkit-border-bottom-left-radius:17px; border-bottom-left-radius:17px; }.CSSTableGenerator tr:hover td{ background-color:#ffffff; } .CSSTableGenerator td{ vertical-align:middle; background:-o-linear-gradient(bottom, #bf5f00 5%, #ffffff 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bf5f00), color-stop(1, #ffffff) ); background:-moz-linear-gradient( center top, #bf5f00 5%, #ffffff 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#bf5f00", endColorstr="#ffffff"); background: -o-linear-gradient(top,#bf5f00,ffffff); background-color:#bf5f00; border:1px solid #85320f; border-width:0px 1px 0px 0px; text-align:center; padding:13px; font-size:12px; font-family:Arial; font-weight:bold; color:#000000; } .CSSTableGenerator tr:first-child td{ background:-o-linear-gradient(bottom, #451a07 5%, #210a02 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #451a07), color-stop(1, #210a02) ); background:-moz-linear-gradient( center top, #451a07 5%, #210a02 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#451a07", endColorstr="#210a02"); background: -o-linear-gradient(top,#451a07,210a02); background-color:#451a07; text-align:center; border-width:0px 0px 1px 0px; font-size:15px; font-family:Arial; font-weight:bold; color:#ffffcc; } .CSSTableGenerator tr:first-child:hover td{ background:-o-linear-gradient(bottom, #451a07 5%, #210a02 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #451a07), color-stop(1, #210a02) ); background:-moz-linear-gradient( center top, #451a07 5%, #210a02 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#451a07", endColorstr="#210a02"); background: -o-linear-gradient(top,#451a07,210a02); background-color:#451a07; } .CSSTableGenerator tr:first-child td:first-child{ border-width:0px 0px 1px 0px; } .CSSTableGenerator tr:first-child td:last-child{ border-width:0px 0px 1px 0px; }