/* ----------------------------------------- Stylesheet for cdeVision / cdeVision.com Author: cdeVision.com Copyright: (c)2007 cdeVision Created: 30 September 2007 Amended: 27 Aug 2008 by Bill -------------------------------------------- */ body {background:#000 url(images/bg.gif); text-align:center; margin:0; padding-bottom:15px; font-family:arial,helvetica,sans-serif; font-size:12px; color:#fff;} h1, h2, h3 {padding:0; margin:0;} h2 {font:normal 25px arial,helvetica,sans-serif; margin:0 0 6px 0; padding:0px;} /* page titles */ h3 {font-size:16px; font-weight:normal; padding-bottom:4px; color:#666;} /* sub-titles */ p {margin:0; padding:0 0 12px 0; line-height:17px;} p.caption {font-size:11px; color:#666 !important; border-top:1px solid #eee; margin-top:3px; padding:0 0 25px 0;} /* on "work" pages */ ul {margin:0; padding:0;} li {} /* page titles */ h2.home {color:#bbb; background:none; width:190px; height:28px; background-position:-1px 3px; background-repeat:no-repeat;} h2.home-services {background-image:url(images/home-services.gif);} h2.home-inPrint {background-image:url(images/home-inPrint.gif)} h2.home-news {background-image:url(images/home-news.gif);} h2.home-featured {background-image:url(images/home-featured.gif);} h2.titleTop {color:#ccc; width:155px; height:28px; background-position:-2px 3px; background-repeat:no-repeat;} h2.recentWork {background-image:url(images/h2-recentWork.gif); background-position:-1px 3px;} h2.about {background-image:url(images/h2-about.gif);} h2.services {background-image:url(images/h2-services.gif);} h2.work {background-image:url(images/h2-work.gif);} h2.clients {background-image:url(images/h2-clients.gif);} h2.contact {background-image:url(images/h2-contact.gif);} h2.clientArea {background-image:url(images/h2-clientArea.gif);} h2.titleMain {color:#bbb; margin-bottom:16px; background:none; width:500px; height:28px; background-position:-2px 3px; background-repeat:no-repeat;} h2.main-about {background-image:url(images/main-about.gif);} h2.main-services {background-image:url(images/main-services.gif);} h2.main-work {background-image:url(images/main-work.gif);} h2.main-clients {background-image:url(images/main-clients.gif);} h2.main-contact {background-image:url(images/main-contact.gif);} h2.main-clientArea {background-image:url(images/main-clientArea.gif);} /* work detail pages */ h2.simpson {background-image:url(images/work-simpson.gif);} h2.govtisgood {background-image:url(images/work-govtisgood.gif);} h2.flywheel {background-image:url(images/work-flywheel.gif);} h2.realty {background-image:url(images/work-realty.gif);} h2.studiosites {background-image:url(images/work-studiosites.gif);} h2.juddwire {background-image:url(images/work-juddwire.gif);} h2.yah {background-image:url(images/work-yah.gif);} h2.csnap {background-image:url(images/work-csnap.gif);} h2.hcpa {background-image:url(images/work-hcpa.gif); width:550px;} h2.mhc {background-image:url(images/work-mhc.gif);} h2.barmate {background-image:url(images/work-barmate.gif);} h2.treydons {background-image:url(images/work-treydons.gif);} h2.simpsonathletics {background-image:url(images/work-simpsonathletics.gif);} h2.skinandveincare {background-image:url(images/work-skinandveincare.gif);} h2.fountainplating {background-image:url(images/work-fountainplating.gif);} h2.touch {background-image:url(images/work-touch.gif);} h2.umasstheater {background-image:url(images/work-umasstheater.gif);} h2.simpsonmagazine {background-image:url(images/work-simpsonmagazine.gif);} h2.hectorfund {background-image:url(images/work-hectorfund.gif);} h2.simpsonedu {background-image:url(images/work-simpsonedu.gif);} h2.sstsystems {background-image:url(images/work-sstsystems.gif);} h2.covertech {background-image:url(images/work-covertech.gif);} h2.mhc-home {background-image:url(images/work-mhc-home.gif);} h2.northamptonbrewery {background-image:url(images/work-nohobrew.gif);} h2.chicopee {background-image:url(images/work-chicopee.gif);} h2.seo {background-image:url(images/work-seo.gif);} h2.mobilesites {background-image:url(images/work-mobilesites.gif);} h2.berklee {background-image:url(images/work-berklee.gif);} h2.elm {background-image:url(images/work-elm.gif);} h2.freedom {background-image:url(images/work-freedom.gif);} h2.blog {background-image:url(images/work-blog.gif);} h2 span {display:none;} img {border:0;} .clearFloats {clear:both; line-height:0px; height:0px; font-size:0px;} .skiplink {display:none;} div.rule {background:#ccc; height:1px; margin:5px 0 15px;} div#printlogo {display:none;} /* fix PNG transparency in IE */ #logo, #clientlogin {behavior:url(scripts/iepngfix.htc);} /* ---- links ----------------------------------------- */ a {color:#4A8797; text-decoration:none; padding:0 1px;} a:visited {} a:hover {color:#fff; background:#bbb;} a:active {color:#4A8797;} a:active, a:focus {outline:none;} a.pdf {background:url(images/icon-pdf.gif) 100% 1px no-repeat; padding:0 30px 0px 1px;} a.pdf:hover {background:#bbb url(images/icon-pdf.gif) 100% 1px no-repeat;} a.doc {background:url(images/icon-doc.gif) 100% 1px no-repeat; padding:0 30px 0px 1px;} a.doc:hover {background:#bbb url(images/icon-doc.gif) 100% 1px no-repeat;} /* off-site link icon */ a.web {background:url(images/icon-web.gif) 99% 1px no-repeat; padding:0 18px 0px 1px;} a.web:hover {background:#bbb url(images/icon-web2.gif) 99% 1px no-repeat;} /* case study link icon */ a.cs {background:url(images/icon-cs.gif) 99% 1px no-repeat; padding:0 18px 0px 1px;} a.cs:hover {background:#bbb url(images/icon-cs2.gif) 99% 0 no-repeat;} /* ---- forms ----------------------------------------- */ form {margin:0;} input, textarea, select, option {font-family:Arial, Helvetica, sans-serif; font-size:12px;} /* ---- ids & classes ----------------------------------------- */ #headerWrap {width:100%; background:#000;} #header {/*border:1px solid red;*/ width:965px; height:175px; margin:0 auto; background:transparent url(images/bg-header.gif) no-repeat; position:relative;} #header span {display:none;} #logo {position:absolute; top:71px; left:97px; width:189px; height:45px; background:transparent url(images/logo.png) no-repeat;} #tag01 {position:absolute; left:220px; top:110px; width:150px;} #tag01 h2 {font:normal 12px/16px arial; height:16px; padding:1px 4px 2px; background:#000;} #tag02 {position:absolute; top:74px; left:345px; width:475px; height:24px; background:#000 url(images/cdev.gif) no-repeat;} #navmenu {position:absolute; bottom:0px; right:0px; width:670px; height:80px; /*border:1px solid blue;*/ overflow:visible !important;} .home {background:transparent url(images/bg-nav.gif) -6px 5px no-repeat;} .about {background:transparent url(images/bg-nav.gif) 55px 5px no-repeat;} .services {background:transparent url(images/bg-nav.gif) 123px 5px no-repeat;} .work {background:transparent url(images/bg-nav.gif) 213px 5px no-repeat;} .clients {background:transparent url(images/bg-nav.gif) 277px 5px no-repeat;} .contact {background:transparent url(images/bg-nav.gif) 355px 5px no-repeat;} #navmenu ul {padding:0; margin:0; position:absolute; bottom:12px; right:65px;} #navmenu ul li {float:left; list-style:none;} #navmenu ul li a {display:block; float:left; margin:8px 0 0 0; padding:0px 10px 0px 10px; text-transform:uppercase; font:normal 14px arial; color:#fff; text-decoration:none; border-left:1px solid #333;} #navmenu a.on {color:#999;} #navmenu a:hover {color:#999; background:none;} #midWrap {width:100%; background:#1e1e1e; border-bottom:5px solid #000;} #mid {width:785px; height:110px; padding:15px 20px; margin:0 auto; background:#333; color:#eee; text-align:left;} #mid p {font-size:16px; line-height:22px; padding:0;} /* home page top: */ #midHomeWrap {width:100%; background:#1e1e1e; border-bottom:5px solid #000;} #midHome {width:785px; padding:15px 20px; margin:0 auto; background:#333; color:#eee; text-align:left;} /* Home page examples: */ #recentWork {width:785px; margin:0 auto; background:#333; color:#eee; text-align:left;} #recentWork h3 {color:#999 !important;} #midHome .xmpl {width:545px; margin-top:-27px; float:right; position:relative;} #midHome .xmpl h3 {font-size:15px; padding:5px 0 3px 0; color:#ddd;} #midHome .xmpl p {font-size:12px; line-height:15px; padding:0 0 12px 0; color:#eee;} #midHome .xmpl img {float:left; display:block; margin:0 15px 0 0;} #midHome ul {list-style:none; width:220px; padding:0; margin:1px 0 0 0; font-size:13px; border-bottom:1px solid #666; float:left;} #midHome li {} #midHome ul li a {display:block; color:#eee; text-decoration:none; height:28px; line-height:28px; border-top:1px solid #666; text-indent:10px;} #midHome ul li a:hover {background:#4A8797; color:#000;} #midHome ul li a.on {background:#4A8797; color:#fff;} /* main area styles */ #main {width:785px; min-height:210px; margin:0 auto; padding:20px 20px 15px; background:#fff url(images/bg-content.gif) 586px 100% no-repeat; border-bottom:5px solid #000; color:#000; text-align:left;} #main h3 {} #main p {color:#333;} #main ul {} #main li {color:#333; line-height:17px;} /* home page */ #homeBox {background:url(images/bg-about.gif) -10px 0 repeat-y; padding:1px 0; margin-bottom:15px;} #homeBox img {float:right; margin:0 0 10px 10px;} #homeBox .col {float:left; width:240px; display:inline; margin-left:30px;} #homeBox .services {background:none;} #homeBox .services ul {list-style:none;} #homeBox .services li {font-size:14px; line-height:20px;} #homeBox .inprint {} .inprint .story {width:210px; padding-bottom:10px; margin-bottom:10px;} .inprint .scroll {width:240px; height:205px; margin-top:10px; overflow:auto;} #homeBox .news {} .news .scroll {width:240px; height:205px; margin-top:10px; overflow:auto;} .news .story {width:210px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #eee;} .news .story {clear:both; overflow:auto;} .inprint .story img {display:block; margin:0 0 5px 0 !important;} .inprint .story p {width:210px; padding:0; line-height:15px;} .news .story p {width:165px; float:left; padding:0; line-height:15px;} .date {margin:2px 10px 0 0; width:30px; background:#efefef; border:1px solid #ccc; float:left; text-align:center;} .date .month {font-size:12px; margin:0 auto; text-align:center; color:#666;} .date .year {font-size:10px; margin:0 auto; text-align:center; color:#999;} /* 2-column layout */ #leftcol {width:500px; float:left;} #leftcol p {padding-bottom:17px;} #rightcol {width:250px; float:right; padding-left:12px; border-left:1px solid #ccc;} #rightcol img {/*display:block;*/ margin:8px 0;} #rightcol ul {padding:0 0 17px 20px;} /* clients page */ #quoteBox {} div.testimonial {display:block;} div.testimonial p {font-size:14px; line-height:20px; font-style:italic;} div.testimonial p.source {font-size:12px; line-height:14px; font-style:normal; text-align:right;} .clientBox .col {float:left; display:inline; } .clientBox ul {margin:0 0 20px 0; list-style:none;} .clientBox li {line-height:17px;} /* 3-column layout (about us page) */ #aboutBox {background:url(images/bg-about.gif) -10px 0 repeat-y; padding:1px 0; margin-bottom:15px;} #aboutBox img {float:right; margin:0 0 10px 10px;} #aboutBox .col {float:left; width:240px; display:inline; margin-left:30px;} /* portfolio thumbnail grid */ table#work {margin:0 auto;} table#work td {vertical-align:top; padding:5px 25px 25px 25px;} table#work td a {display:block; margin:0; padding:0; background:none;} table#work td a:hover {color:#333;} table#work td img {display:block; margin:0;} table#work td a:hover img {filter:alpha(opacity=50); -moz-opacity:0.4; opacity:0.4; -khtml-opacity:0.4;} /* contact & client login forms */ p.error {padding:0 0 20px 20px !important; background:url(images/icons/warning.gif) 0 0 no-repeat; color:#de0000 !important;} #formBox {padding:6px 0 12px 0; margin-left:50px;} #formBox label {float:left; width:100px; text-align:right; padding-right:6px;} #formBox input, #formBox textarea, #formBox select {width:250px; margin-bottom:5px; background:#f4f4f4; border:1px solid #ccc;} #formBox textarea {width:250px; height:150px;} #formBox p {margin-left:106px; padding:3px 0 5px;} #formBox img {display:block; margin-left:106px;} #formBox .boxes {width:1em;} #formBox input#submitbutton {margin-left:110px; margin-top:5px; width:120px; background:#ccc !important;} #formBox br {clear:left;} /* google map on contact page */ #map_canvas {width:250px; height:300px; background:#efefef; border:1px solid #ccc; margin-bottom:12px;} #map_canvas img {background:transparent;} /* footer styles */ #footer {width:825px; margin:0 auto; background:#2b2b2b; height:75px; border-bottom:5px solid #000; position:relative; color:#b5b5b5; text-align:left;} #footer p {font:normal 10px/14px verdana;} #cdevinfo {position:absolute; left:20px; top:10px;} #cdevinfo h2 {width:93px; height:19px; background:transparent url(images/cdevision.gif) no-repeat; padding:0; margin:0;} #cdevinfo span {display:none;} #cdevinfo a {text-decoration:underline; color:#b5b5b5;} #cdevinfo a:hover {background:none; text-decoration:none;} #copyright {position:absolute; right:20px; bottom:0;} #mediaicons {position:absolute; right:20px; top:0; text-align:right; background:transparent url(images/bg-clientlogin.gif) 40px 0 no-repeat; width:240px; height:60px; z-index:10;} #mediaicons span {display:none;} #mediaicons a {float:right; width:16px; height:16px; margin:8px 0 0 8px;} #mediaicons a.facebook {background:transparent url(images/facebook.png) 0 0 no-repeat;} #mediaicons a.myspace {background:transparent url(images/myspace.png) 0 0 no-repeat;} #mediaicons a.twitter {background:transparent url(images/twitter.png) 0 0 no-repeat;} /* client login not used, as of 052209 */ #clientlogin {position:absolute; right:20px; top:0; text-align:right; background:transparent url(images/bg-clientlogin.gif) 40px 0 no-repeat; width:240px; height:60px; z-index:10;} #clientlogin a {text-transform:uppercase; font:normal 12px arial; color:#ccc; text-decoration:none; line-height:30px; z-index:20;} #clientlogin a:hover {color:#666; background:none;}