@import url("reset.css"); @import url("filters.css");/*When changing widths, remember to update in filters files for IE5/6*/ body {font:62.5%/1.4 Verdana, Arial, Helvetica, sans-serif; text-align:center; color:#807f7f} p {margin-bottom:1em; font-size:1.1em} h3 {font-size:11px; color:#28b7e3; font-weight:bold} /*link section*/ a:link {text-decoration:none; color:#807f7f} a:visited {text-decoration:none; color:#897f7f} a:hover {text-decoration:underline} a:active {text-decoration:underline} .last {margin-right:0 !important;} blockquote {background:url(../images/quotemark-open.gif) no-repeat 0 2px; padding:0 14px} blockquote p.last {background:url(../images/quotemark-close.gif) no-repeat right bottom} h2 span {position:absolute; left:-9999px} h3 span {position:absolute; left:-9999px} h6 span {position:absolute; left:-9999px} /* Header graphics -------------------------------------------------------------------------------*/ h2#what-we-do, h6#what-we-do {width:103px; height:20px; background:url(../images/headings/h-what-we-do.gif) no-repeat;} h2#what-people-say {width:145px; height:20px; background:url(../images/headings/h-what-people-say.gif) no-repeat} h2#how-to-find-us {width:123px; height:20px; background:url(../images/headings/h-how-to-find-us.gif) no-repeat} /* The graphics for each services page can be changed here, by adjusting the body class="" attribute. For example: body.foobar h6.title {width:106px; height:20px; background:url(../images/headings/h-foobar.gif) no-repeat;} */ body.tips-tricks h6.title {width:106px; height:20px; background:url(../images/headings/h-tandt.gif) no-repeat;} body.services h6.title {width:106px; height:20px; background:url(../images/headings/h-services.gif) no-repeat;} body.twaters h6.title {width:142px; height:20px; background:url(../images/headings/h-twaters.gif) no-repeat;} body.hnews h6.title {width:142px; height:20px; background:url(../images/headings/h-news.gif) no-repeat;} #content h2.title, #content h3.title, #content h6.title {margin:0px 0 9px 30px} /* Main body -------------------------------------------------------------------------------*/ #wrapper {margin:0 auto; width:758px; text-align:left;} .phone-number {float:left; margin:8px 0 8px 0px;} /* Top area with logo and navigation -------------------------------------------------------------------------------*/ #masthead {clear:left;float:left; background:url(../images/masthead.jpg) no-repeat left top; width:758px; height:56px; margin:0 0 13px} #masthead img.logo {float:left; margin:8px 0 0 14px; display:inline} #masthead h1 span{ position:absolute; left:-9999px} /* Navigation -------------------------------------------------------------------------------*/ ul#nav {float:left; margin:18px 0 0px 30px;}/*Change '93px' to adjust top nav*/ ul#nav li {font-size:17px; float:left; margin-right:18px; list-style:none; background:url(../images/orange-arrow.gif) no-repeat 0 50%; padding-left:24px;} ul#nav li a:link {color:#28b7e3; text-decoration:underline} /* The main content block -------------------------------------------------------------------------------*/ #main {float:left;width:758px; height:595px; background:url(../images/home/mainpage.jpg) no-repeat;} #main ul {margin-bottom:1em}/*General list styles*/ #main li {font-size:11px; list-style:none; background:url(../images/list-arrows.gif) no-repeat left 4px; padding:0 0 0 12px; line-height:1.2} /*Got trouble with your water banner*/ #banner {float:left; padding:10px 8px 0;} #banner img {} /*For holding sections (on the homepage and services page)*/ #details {float:left; padding:9px 0 0 10px; height:182px;} .section {width:215px; float:left; margin-right:23px; padding:8px 8px 0; background:url(../images/blue-arrow.gif) no-repeat 10px 7px} .section h2, .section h3, .section h6 {margin:0 0 8px 30px; float:left} .section p, .section blockquote, .section ul, .section h3 {clear:both;} /* Footer and text*/ #footer {clear:left; text-align:center; float:left; border-top:1px solid #ddd; margin:12px 9px; width:724px; padding:8px 0} #footer li {list-style:none; color:#897F7F; display:inline; background:none; padding:0; font-size:11px} #footer li a:hover {color:#897F7F; text-decoration:underline} /* Homepage -------------------------------------------------------------------------------*/ /*Info box - includes experience inspires and news*/ #info {clear:left; float:left; width:740px; padding:5px 8px 0 10px} #about {float:left; position:relative; padding:0 0 0 8px; margin-right:29px; width:470px; background:url(../images/orange-arrow.gif) no-repeat 10px 0px; display:inline} #about h2 {background:url(../images/headings/h-experience-inspires.gif) no-repeat left top; width:266px; height:20px; display:block; margin:3px 0 10px 30px} #about img {float:right; margin:13px 0 0 0;} #news {float:left; width:200px; padding:0 9px; background:url(../images/orange-arrow.gif) no-repeat 10px 1px} #news h2 {background:url(../images/headings/h-news.gif) no-repeat left top; width:46px; height:20px; display:block; margin:4px 0 10px 30px} #news li {margin-bottom:1em} /* Services page -------------------------------------------------------------------------------*/ /*Extended background in next rules*/ #service #main {float:left;width:758px; height:auto; background:url(../images/subpage/mainpage-bottom.jpg) no-repeat left bottom;} #service #main-in {float:left; width:758px; overflow:hidden; padding:0 0 40px; background:url(../images/subpage/mainpage-top.jpg) no-repeat left top;} #content {float:left; padding:17px 20px 0 10px; width:464px;background:url(../images/orange-arrow.gif) no-repeat 10px 15px} #content h1 {font-size:18px; color:#29b7e3; margin-bottom:0.75em;} #content h2 {font-size:14px; font-weight:bold; color:#29b7e3; margin-bottom:0.9em;}