/*------------------------------------------------------------ CSS by Rod Miles of Hybrid Forge www.Hybrid Forge.com January 2008 Home page styles -------------------------------------------------------------*/ /* Misc -------------------------------------------------------------*/ #tmpMsg { width: 445px; border: 2px solid #c8451d; margin-bottom: 1em; border-radius: 0.6em; -moz-border-radius: 0.6em; } #tmpMsg div { padding: 0.5em; } #rightCol #hfSearch #hfsearch { width: 407px; } /* HTML Items -------------------------------------------------------------*/ h1 { background: transparent; padding: 0; margin: 0; line-height: 1.1em; } /* Layout Items -------------------------------------------------------------*/ #contentTopper { height: 137px; background: transparent; margin: 0; padding: 0; background: url('http://images.hybridforge.com/images/banner-00.jpg') no-repeat -1px 0; } #content { overflow: hidden; background: #fff url('http://images.hybridforge.com/images/content-bg-main.gif') repeat-y 0 0; } #contentBody { float: none; width: 950px; right: 0; padding: 1em 0 0 0; } a#banner { display: block; position: relative; height: 137px; width: 960px; } #bannerImg, #bannerImgNS { margin: 0 0 0 -1px; } #leftCol, #rightCol { position: relative; width: 48%; padding-bottom: 1em; } #leftCol { float: left; left: 15px; } #rightCol { float: right; } #homeContentFooter { clear: both; padding: 0 15px; } /*/// iPhone Space ///*/ #iPhoneArea { width: 450px; line-height: 1.3em; } #iPhoneArea h3 { -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; border-top-left-radius: 8px; -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; border-top-right-radius: 8px; margin: 0; padding: 0 0 0 10px; height: 32px; line-height: 32px; background-color: #ccc; background: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(#999999)); background: -moz-linear-gradient(top, #dddddd, #999999); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#999999'); text-shadow: 0 1px 0 #efefef; } /*#iPhoneArea h3 span { display: none; }*/ #iPhoneArea .iPhoneInner { overflow: visible; height: 200px; padding: .5em 0 0; border: 1px solid #ccc; border-width: 0 1px 1px 1px; text-align: left; background-color: #eee; } #iPhoneArea .iPhoneInner .cycle { float: left; margin-left: 15px; } #iPhoneArea .iPhoneInner .cycle div { width: 180px; height: 180px; } #iPhoneArea .iPhoneInner .info { float: right; width: 230px; position: relative; right: 10px; } /*/// Mini Portfolio Space ///*/ #miniPortfolio { width: 450px; height: auto; position: relative; overflow: hidden; margin: 15px 0 0; background-color: #fff; color: #000 } #miniPortfolio h3 { -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; border-top-left-radius: 8px; -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; border-top-right-radius: 8px; margin: 0; padding: 0 0 0 10px; height: 33px; line-height: 32px; background-color: #ccc; background: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(#999999)); background: -moz-linear-gradient(top, #dddddd, #999999); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#999999'); text-shadow: 0 1px 0 #efefef; } /*#miniPortfolio h3 span { display: none; }*/ .portfolioItem { padding: 1em 0 0 2em; } .portfolioItem img { float: right; margin: 0 .5em 0 1.5em; } .portfolioLink { text-align: right; } #miniPortfolio .cycle { border: 1px solid #ccc; height: 200px; border-width: 0 1px 1px 1px; position: relative; overflow: hidden; } #miniPortfolio #cycleNav { float: right; width: 50px; margin-top: 10px; } #cycleNav a { float: left; display: block; width: 13px; height: 16px; background: url('http://images.hybridforge.com/images/mini-portfolio-nav.png') no-repeat 0 0; } #cycleNav a span { display: none; } #cycleNav a#bannerPrev { background-position: 0 0; margin-right: 5px; } #cycleNav a#bannerPrev:hover { background-position: 0 -20px; } #cycleNav a#bannerNext { background-position: right 0; } #cycleNav a#bannerNext:hover { background-position: right -20px; } #rightPicDiv { height: 310px; margin-top: 15px; } a#hcLink { display: block; width: 449px; height: 515px; clear: both; background: url('http://images.hybridforge.com/images/pic-hybrid-commerce-01.jpg') no-repeat 0 bottom; } a#hcLink b { display: none; } /*/// Notebox ///*/ .noteBox { min-height: 100px; width: 449px; font-size: 1em; margin-top: 20px; } .noteBox .noteBody { width: 245px; margin-left: 15px; } #contentBody .noteBox a.noteBoxContactLink { right: 10px; } /* RSS Items -------------------------------------------------------------*/ /*/// RSS CONTENT ITEMS ///*/ #rssTop5 { clear: both; width: 462px; height: auto; color: #fff; margin: 0 0 0 0; padding-bottom: 8px; background: url('http://images.hybridforge.com/images/rss-bottom-bg.gif') no-repeat 0 100%; } #rssTop5 .rssHeading { background: url('http://images.hybridforge.com/images/rss-heading-bg.gif') no-repeat 0 0; min-height: 30px; line-height: 30px; } * html #rssTop5 .rssHeading { height: 30px; } #rssTop5 .rssHeading h2 { float: left; margin:0; padding:0 0 0 10px; color:#fff; font-size: 1.2em; border: none; line-height: 30px; } #rssTop5 .rssHeading a { float: right; padding: 0 10px 0 11px; color: #fff; font-size: 0.9em; text-decoration: none; background: url('http://images.hybridforge.com/images/arrow-01.gif') no-repeat 0 center; } #rssTop5 .rssHeading a:hover { color: #ccc; } #rssTop5 .rssHeading a:active { color: #333; } #rssTop5 .rssContent { clear: both; background-color: #999; padding-bottom: 5px;} #rssTop5 .rssContent .rssContentInside { padding: 10px 12px 0 12px; } * html #rssTop5 .rssContent .rssContentInside { padding: 10px 0 0 0; margin: 0 12px; } #rssTop5 .rssContent .rssItem { background: #353535 url('http://images.hybridforge.com/images/rss-content-item-bg.jpg') no-repeat 0 0; border: 1px solid #4a4a4a; margin-bottom: 10px; overflow: auto; } * html #rssTop5 .rssContent .rssItem { height: 1%; } #rssTop5 .rssContent .rssItem .rssLeftCol { float: left; width: 75px; padding: 8px 0 0 8px; } #rssTop5 .rssContent .rssItem .rssLeftCol a { display: block; padding: 3px 0 0 18px; text-decoration: none; } #rssTop5 .rssContent .rssItem .rssLeftCol a.rssViewLink { background: url('http://images.hybridforge.com/images/rss-link-view.gif') no-repeat 0 4px; } #rssTop5 .rssContent .rssItem .rssLeftCol a.rssFeedLink { background: url('http://images.hybridforge.com/images/rss-link-feed.gif') no-repeat 0 4px; } #rssTop5 .rssContent .rssItem .rssRightCol { float: right; width: 323px; padding: 0 0 0 12px; margin: 5px 10px 5px 5px; border-left: 1px solid #ccc; line-height: 130%; } * html #rssTop5 .rssContent .rssItem .rssRightCol { margin-right: 12px; width: 310px; } #rssTop5 .rssContent .rssItem .rssRightCol a.rssItemTitle { font-weight: bold; } #rssTop5 .rssContent .rssItem .rssRightCol .rssItemDesc { padding-bottom: 4px; } #rssTop5 .rssContent .rssItem a { color: #fff; } #rssTop5 .rssContent .rssItem a:hover { color: #ccc; text-decoration: none; } #rssTop5 .rssContent .rssItem a:active { color: #aaa; }