@charset "utf-8"; /* CSS Document */ /*********************************** Global Styles ***********************************/ body {background:url(../img/global/sitebackground.png) repeat-x #F2F2F2; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333; line-height:19px;} a {color:#3497AB; text-decoration:none;} a:hover {color:#000; text-decoration:underline;} /*********************************** Layout ***********************************/ #container {width:992px; margin:auto; position:relative;} #header {height:92px; margin-bottom:15px;} #nav {height:35px;} #headerImage {height:156px; padding:5px; background-color:#FFF;} #prices {height:44px; background-color:#FFF; padding:0 6px 10px 6px;} #prices a {background:url(../img/global/prices.gif); display:block; width:139px; height:34px; margin-right:5px; float:left; text-decoration:none; color:#FFF; padding:5px 10px;} #prices a:hover {background:url(../img/global/pricesOn.gif);} .pricesDec {float:left; width:69px; line-height:15px; padding-top:2px; text-align:center;} .pricesPrice {float:left; width:65px; margin-left:5px; font-size:24px; line-height:34px; font-weight:bold;} #contentArea {background-color:#FFF;} #leftBar, #rightBar {width:218px; margin:0 5px 5px 5px; float:left;} #mainCont {float:left; width:516px; padding:0 9px;} #twocolCont {float:left; width:734px; padding:0 0 0 10px;} #fullcont {width:972px; padding:0 10px 0 10px;} #footerLogos {padding:0 5px 10px 5px; text-align:center; border-top:4px solid #f4f4f4; padding-top:10px;} #footerLogos img {margin:0 3px; vertical-align:middle;} #footer {padding:5px; font-size:10px; color:#666; text-align:center;} #footer a {color:#666; text-decoration:underline;} #footer a:hover {color:#000; text-decoration:none;} #CMSbanner {position:absolute; width:218px; height:134px; left:773px; top:145px;} /*********************************** Fonts ***********************************/ .price {font-size:27px; line-height:35px; font-weight:bold; text-align:right;} .priceDesc {line-height:15px; padding-top:2px; font-weight:bold; text-align:left;} h1 {font-size:20px; color:#333333; margin-bottom:10px;} h2 {font-size:17px; color:#333333; margin-bottom:10px;} h4 {font-size:13px; color:#3397AB; margin-bottom:10px; font-weight:bold;} h5 {font-size:13px; color:#000; margin-bottom:10px;} .blackbold {font-size:14px; color:#3497AB; font-weight:bold;} .smallfont {font-size:10px; color:#999;} .copyh2 {font-size:17px; color:#333333; margin-bottom:10px; font-weight:bold;} .otherservice h2 {font-size:13px; color:#3397AB; margin-bottom:10px; font-weight:bold;} .aboutpom h2 {font-size:13px; color:#3397AB; margin-bottom:10px; font-weight:bold;} /*********************************** Header ***********************************/ #logo {width:319px; float:left;} #telephoneEmail {float:left; width:202px; margin:49px 0 0 33px;} #loginShare {margin:33px 0 0 157px; width:281px; float:left;} #clientlogin {float:left; background:url(../img/global/clientLogin.png); width:90px; height:16px;} #addthis {float:right; width:125px;} #loginButton {float:right; width:77px; margin:10px 0 0 10px;} #loginField {width:184px; float:left; margin-top:10px;} #loginField input {border:1px solid #fff; width:174px; background-color:#fff; margin:0px; padding:5px; font-size:11px; color:#666;} /*********************************** Nav ***********************************/ #home a, #homeOn a, #portOn a, #port a, #onlinestore a, #onlinestoreOn a, #ourprices a, #ourpricesOn a, #otherservices a, #otherservicesOn a, #getaquote a, #getaquoteOn a, #contactus a, #contactusOn a, #about a, #aboutOn a, #blog a, #blogOn a {display:block; line-height:35px; text-align:center; color:#FFF; float:left; margin-right:3px; text-decoration:none; font-size:13px;} #home a {background:url(../img/nav/home.png); width:96px;} #homeOn a, #home a:hover {background:url(../img/nav/homeOn.png); color:#000; width:96px;} #port a {background:url(../img/nav/portfolio.png); width:96px;} #portOn a, #port a:hover {background:url(../img/nav/portfolioOn.png); color:#000;width:96px;} #onlinestore a {background:url(../img/nav/onlinestore.png); width:130px;} #onlinestoreOn a, #onlinestore a:hover {background:url(../img/nav/onlinestoreOn.png); color:#000;width:130px;} #ourprices a {background:url(../img/nav/prices.png); width:82px; margin-right:4px;} #ourpricesOn a, #ourprices a:hover {background:url(../img/nav/pricesOn.png); color:#000;width:82px; margin-right:4px;} #otherservices a {background:url(../img/nav/otherservices.png); width:137px; margin-right:4px;} #otherservicesOn a, #otherservices a:hover {background:url(../img/nav/otherservicesOn.png); color:#000;width:137px; margin-right:4px;} #getaquote a {background:url(../img/nav/getaquote.png); width:122px; margin-right:4px;} #getaquoteOn a, #getaquote a:hover {background:url(../img/nav/getaquoteOn.png); color:#000; width:122px; margin-right:4px;} #contactus a {background:url(../img/nav/contactus.png); width:114px; margin-right:4px;} #contactusOn a, #contactus a:hover {background:url(../img/nav/contactusOn.png); color:#000;width:114px; margin-right:4px;} #about a {background:url(../img/nav/aboutpom.png); width:114px; margin-right:4px;} #aboutOn a, #about a:hover {background:url(../img/nav/aboutpomOn.png); color:#000;width:114px; margin-right:4px;} #blog a {background:url(../img/nav/blog.png); width:72px; margin-right:0px;} #blogOn a, #blog a:hover {background:url(../img/nav/blogOn.png); color:#000; width:72px; margin-right:0px;} /*********************************** Buttons ***********************************/ #login a {background:url(../img/btns/login.png); height:27px; width:77px; display:block;} #login a:hover {background-position:0 27px;} #login span {display:none;} .sendenquiry a {background:url(../img/btns/send-enquiry.png); height:27px; width:107px; display:block; margin-top:6px;} .sendenquiry a:hover {background-position:0 27px;} .sendenquiry span {display:none;} #readmore a {background:url(../img/btns/readmore.png); height:27px; width:107px; display:block; margin-top:10px;} #readmore a:hover {background-position:0 27px;} #readmore span {display:none;} .readmore a {background:url(../img/btns/readmore.png); height:27px; width:107px; display:block; margin-top:10px;} .readmore a:hover {background-position:0 27px;} .readmore span {display:none;} .viewwebsite a {background:url(../img/btns/viewwebsite.png); height:27px; width:107px; display:block; margin:0 55px; float:left;} .viewwebsite a:hover {background-position:0 27px;} .viewwebsite span {display:none;} /*********************************** Header Images ***********************************/ /*********************************** Left Bar / Right Bar ***********************************/ .sidehead {line-height:35px;} .sidehead h3 {background:url(../img/global/sidebar-header.gif); width:218px; height:35px; font-size:13px; color:#FFF; text-indent:10px;} .sideback {background:url(../img/global/sidebar-back.gif) repeat-y; margin-bottom:15px;} .sidecont {padding:5px 10px 10px 10px; background:url(../img/global/sidebar-footer.gif) bottom no-repeat; } #freequote input {border:1px solid #ccc; width:95%; background-color:#fff; margin:10px 0 0 0; padding:5px; font-size:11px; color:#666;} #freequote textarea {border:1px solid #ccc; width:95%; background-color:#fff; line-height:25px; padding:0px; margin:10px 0 0 0; padding:0 5px; font-size:11px; color:#666; font-family:Arial, Helvetica, sans-serif;} .standardfeat img {float:left; width:31px; margin-right:10px; margin-bottom:5px;} .standardfeat span {float:left; width:155px; font-size:12px; padding-top:2px;} .standardfeat2 img {float:left; width:31px; margin-right:10px; margin-bottom:5px;} .standardfeat2 span {float:left; width:155px; font-size:12px; padding-top:2px;} #testTop {background:url(../img/global/quoteTL.gif); width:30px; height:33px; float:left; margin-bottom:10px;} #testBottom {background:url(../img/global/quoteBL.png); width:33px; height:29px; float:right;} ul#portfolio {list-style:none; margin:0px; padding:0px;} .latestType, .latestLink {padding-left:30px; display:block;height:25px; font-size:11px; margin-top:5px;} .latestType {background:url(../img/global/latest-type-icon.gif) left no-repeat; line-height:25px;} .latestLink {background:url(../img/global/latest-link-icon.gif) left no-repeat;} .latestLink a, latestType a {font-weight:bold; text-decoration:none; color:#000;} #portfolio img {border:1px solid #000;} #portfolio img:hover {border:1px solid #F90;} .visitblog a {float:right; font-size:12px; font-weight:lighter; background:url(../img/global/link-arrowOn.png) left no-repeat; padding-left:5px; display:block; color:#fff; text-decoration:none; padding-right:10px;} .blogDiv a {padding-bottom:5px; margin-bottom:5px; display:block; padding:4px; border:1px solid #fff; text-decoration:none;border-bottom:3px solid #dadada; } .blogDiv a:hover {background-color:#f4f4f4; border:1px solid #ccc; text-decoration:none; border-bottom:3px solid #3FA0D0; } /*********************************** Main Content ***********************************/ .subhead {background:url(../img/global/mainbodyHead.png); width:516px; height:29px; color:#FFF; text-indent:10px; line-height:29px; font-size:12px; font-weight:bold;} .featuredFoot {background:url(../img/global/featuredFoot.gif) top no-repeat; width:516px; height:9px;} .featuredCont {background-color:#F2F2F2; border-left:1px solid #ccc; border-right:1px solid #ccc; width:514px;} .featuredCont2 {background-color:#F2F2F2; border-left:1px solid #ccc; border-right:1px solid #ccc; width:732px;} #homefeaturedTop {background:url(../img/global/homefeaturedTop.gif) bottom no-repeat; height:8px;} #homefeaturedBottom {background:url(../img/global/homefeaturedBottom.gif) top no-repeat; height:8px; margin-bottom:10px;} #homefeaturedBack {border-left:1px solid #ccc; border-right:1px solid #ccc; padding:5px 10px; background-color:#f4f4f4;} #homefeaturedBack ul {padding-left:0px; margin:0px;} #homefeaturedBack li {list-style:none; background:url(../img/global/homefeaturedIcon.gif) left top no-repeat; padding-left:27px; padding-bottom:10px; min-height:25px;} #knowmore {width:510px; margin-bottom:10px;} #knowmore2 {width:735px;} #knowmore input {border:1px solid #ccc; width:220px; background-color:#fff; margin:10px 0 0 0; padding:5px; font-size:11px; color:#666;} #knowmore .fl {width:240px; margin-right:10px;} #knowmore2 input {border:1px solid #ccc; width:330px; background-color:#fff; margin:10px 0 0 0; padding:5px; font-size:11px; color:#666;} #knowmore2 .fl {width:340px; margin-right:10px;} /*********************************** Portfolio ***********************************/ .websiterow {padding:0px;} .website {width:214px; border:5px solid #eee; float:left; margin:8px;} .website:hover {border:5px solid #bbb;} .linebreak {background-color:#f0f0f0; height:3px; width:731px; margin:0;} .boxgrid h5 {color:#FFF; font-size:12px; font-weight:bold; margin:0px; padding:0px;} .boxgrid p {color:#FFF; font-size:11px;} .boxgrid a {font-size:12px;} .boxgrid a:hover {color:#FFF; text-decoration:underline;} .boxgrid {width: 214px; height: 169px; float:left; background:#161613; overflow: hidden; position: relative;} .boxgrid img {position: absolute; top: 0px; left: 0px; border: 0px; width: 214px;} .captionfull .boxcaption {top: 165px; left: 0;} .caption .boxcaption {top: 170px; left: 0;} .pagination {margin:10px 0; font-weight:bold; padding-top:10px; border-bottom:1px solid #dadada; border-top:1px solid #dadada;} .paginationText {float:left;} .paginationText h3 {font-size:13px; color:#CCC; letter-spacing:5px; line-height:37px;} .pagination a {padding:5px 10px; background-color:#233232; margin:2px; color:#FFF; float:right;} .pagination a:hover {background:#FF9900; color:#fff; text-decoration:none;} .pagination span {background:#FF9900; color:#fff; text-decoration:none; padding:5px 10px; margin:2px; float:right;} .featuredFootPort {background:url(../img/portfolio/featuredFoot.gif); width:734px; height:9px;} .featuredHeadPort {background:url(../img/portfolio/featuredhead.png); width:734px; height:29px; font-size:12px; font-weight:bold; margin-top:10px;} .featuredHeadPort h2 {font-size:12px; font-weight:bold; color:#FFF; text-indent:10px; line-height:29px; } .featimage {float:left; width:425px; margin-right:10px; border:1px solid #666;} .featText {float:left; width:240px;} .featText span {color:#000; font-size:15px; font-weight:bold;} .featText img {margin-top:05px;} /*********************************** Prices ***********************************/ .pricesquote input {border:1px solid #ccc; width:96%; background-color:#fff; margin:10px 0 0 0; padding:5px; font-size:11px; color:#666;} .pricesquote textarea {border:1px solid #ccc; width:96%; background-color:#fff; padding:5px; font-size:11px; color:#666; font-family:Arial, Helvetica, sans-serif; margin-top:10px;} .pricesquote {width:350px; margin-top:10px;} .pricesquoteBox {border:1px solid #ccc; background-color:#f1f1f1; padding:10px; float:right; width:350px; margin-left:20px;} .optionalextrasHead {background:url(../img/prices/extrasheader.png); width:734px; height:29px; color:#FFF; text-indent:10px; line-height:29px; font-size:12px; font-weight:bold; margin-top:10px;} .optionalextrasBack {background-color:#F2F2F2; border-left:1px solid #ccc; border-right:1px solid #ccc;} .optionalextrasBack ul {padding-left:0px; margin:0px;} .optionalextrasBack li {list-style:none; background:url(../img/global/homefeaturedIcon.gif) left top no-repeat; padding-left:27px; padding-bottom:10px; min-height:16px;} /*********************************** Get a Quote ***********************************/ .getaquotebox input {border:1px solid #ccc; background-color:#fff; margin-bottom:10px; padding:5px; font-size:11px; color:#666; width:230px;} .getaquotebox textarea {border:1px solid #ccc; width:96%; background-color:#fff; padding:5px; font-size:11px; color:#666; font-family:Arial, Helvetica, sans-serif; height:200px; margin-bottom:10px;} .getaquotebox {border:1px solid #ccc; background-color:#f1f1f1; padding:10px; margin-bottom:10px;} .getaquotebox select {border:1px solid #ccc; background-color:#fff; line-height:25px; margin-bottom:10px; padding:5px; font-size:11px; color:#666;} /*********************************** Misc ***********************************/ .linkarrow a {background:url(../img/global/link-arrowOn.png) left no-repeat; padding-left:20px; display:block; color:#fff; text-decoration:none; padding-right:10px;} .linkarrow a:hover {background:url(../img/global/link-arrow.png) left no-repeat; color:#243333; text-decoration:none;} .phone {background:url(../img/global/icon-phone.gif) left no-repeat; padding-left:30px; margin-bottom:10px;} .mail {background:url(../img/global/icon-mail.gif) left no-repeat; padding-left:30px;} .mail a {color:#333;} .mail strong, .phone strong {color:#3497AB;} #ecombulletLeft {float:left; width:359px; margin-right:15px;} #ecombulletRight {float:left; width:359px;} #ecombulletLeft ul, #ecombulletRight ul {margin:0px; padding:0px; list-style:none; background-color:#f5f5f5; border:1px solid #dadada; padding:10px; margin-bottom:10px;} #ecombulletLeft li, #ecombulletRight li {background:url(../img/global/ecombullet.gif) left top no-repeat; padding-left:30px; padding-bottom:10px; margin-bottom:10px; border-bottom:3px solid #fff;} #ecombulletLeft h5, #ecombulletRight h5 {color:#F90;} .imgborder {border:3px solid #555; margin:0 0 10px 10px;} #breadcrumb {font-size:10px; border-bottom:1px dotted #dadada; padding-bottom:3px; margin-bottom:10px;} #breadcrumb a {background:url(../img/global/bullet-bread.gif) right center no-repeat; padding-right:8px;} #payments {} #payments input {border:1px solid #ccc; background-color:#fff; margin-bottom:10px; padding:5px; font-size:11px; color:#666; width:230px;} #payments select {border:1px solid #ccc; background-color:#fff; margin:0 0 10px 0; padding:5px; font-size:11px; color:#666;} #cclogo {background:url(../img/global/creditcardlogos.png); width:198px; height:107px; margin-top:30px;} .quoteL {background:url(../img/global/qleft.gif) top left no-repeat; border-bottom:3px solid #eee; margin-bottom:20px;} .quoteR {background:url(../img/global/qright.gif) bottom right no-repeat; padding:10px 20px 20px 30px;} .quoteAttrib {color:#FF9900; font-weight:bold; margin-top:10px; background:url(../img/global/qmark.gif) left no-repeat; padding-left:27px;} #paybox {border:1px solid #ccc; background-color:#f1f1f1; padding:10px;} #sitemap li {list-style:none; background:url(../img/global/bullet-bread.gif) left no-repeat; padding-left:10px;} .otherservices li {background:url(../img/global/ecombullet.gif) left top no-repeat; padding-left:30px; padding-bottom:4px; margin-bottom:4px; border-bottom:3px solid #fff; list-style:none;} /*********************************** Tooltip ***********************************/ #prices a {display: block; text-decoration: none; position: relative;} #prices em {background: url(../img/global/hover.png) no-repeat; width: 130px; height: 100px; position: absolute; top: -85px; left: 5px; text-align: left; font-style: normal; z-index: 2; color:#000; font-size:11px; padding: 10px 12px 10px; line-height:15px; display: none;} .standardfeat a {display: block; text-decoration: none; position: relative;} .standardfeat em {background: url(../img/global/hover2.png) no-repeat; width: 130px; height: 100px; position: absolute; top: -85px; left: -150px; text-align: left; font-style: normal; z-index: 2; color:#000; font-size:11px; padding:10px 12px 10px; line-height:15px; display: none;} .standardfeat2 a {display: block; text-decoration: none; position: relative; z-index:999} .standardfeat2 em {background: url(../img/global/hover3.png) no-repeat; width: 130px; height: 100px; position: absolute; top: -85px; left: 150px; text-align: left; font-style: normal; z-index: 2; color:#000; font-size:11px; padding:10px 12px 10px; line-height:15px; display: none; z-index:999;}