body { color: black; font-family: "trebuchet ms", Arial, Helvetica, SunSans-Regular, sans-serif; background-color: #fbfbfb; margin: 0; padding: 0; } blockquote { color: #807f77; background: url(../images/quote.gif) no-repeat; display: block; font: 14px Georgia, serif; padding-left: 24px } a:link { color: #4682b4; text-decoration: underline; } a:visited { color: #4682b4; text-decoration: underline; } a:hover { color: #b22222; text-decoration: none; } .wrap { background-color: white; width: 1000px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto !important; } .floatleft { float: left; } .brand { background-color: #feffff; background-repeat: no-repeat; } .brandtext { font-size: 20px; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; line-height: 26px; text-align: justify; height: 75px; float: right; padding-top: 24px; padding-right: 22px; } .brandlargetext { font-size: 29px; text-align: justify; } .brandtext a:link, a:visited { text-decoration: underline; } .brandtext a:hover { color: #b22222; text-decoration: none; } .navwrap { padding-left: 25px; } .navtopshadow { line-height: 10px; background-image: url(../images/navshadowtop.jpg); width: 1000px; height: 15px; display: block; } .navbottomshadow { line-height: 10px; background-image: url(../images/navshadowbottom.jpg); display: block; width: 1000px; height: 16px; } /************************************************************** Image Menu v 2.2 **************************************************************/ #imageMenu { position: relative; width: 961px; height: 108px; overflow: hidden; } #imageMenu ul { list-style: none; margin: 0; display: block; height: 108px; width: 1000px; padding-left: 0; } #imageMenu ul li { float: left; } #imageMenu ul li a { text-indent: -1000px; background:#ffffff 0 50%; border-right: 2px solid #fff; cursor:pointer; display:block; overflow:hidden; width:105px; height: 108px; } #imageMenu ul li.shortrun a { background: url(../images/navigationimages/shortrun.gif) repeat scroll 0%; } #imageMenu ul li.longperfect a { background: url(../images/navigationimages/longperfect.gif) repeat scroll 0%; } #imageMenu ul li.longcase a { background: url(../images/navigationimages/longcase.gif) repeat scroll 0%; } #imageMenu ul li.colour a { background: url(../images/navigationimages/colour.gif) repeat scroll 0%; } #imageMenu ul li.specialist a { background: url(../images/navigationimages/specialistNew.gif) 0 50%; } #imageMenu ul li.childrens a { background: url(../images/navigationimages/childrens.gif) 0 50%; } #imageMenu ul li.consultancy a { background: url(../images/navigationimages/consultancy.gif) 0 50%; } #imageMenu ul li.design a { background: url(../images/navigationimages/design.gif) 0 50%; } #imageMenu ul li.casestudies a { background: url(../images/navigationimages/casestudies.gif) 0 50%; } #imageMenu ul li.contact a { background: url(../images/navigationimages/contact.gif) 0 50%; width: 105px; } .clear { clear: both; } /*************************************************************/ /*activenavigation*/ .activeindicatorwrap { height: 10px; padding-top: 7px; padding-left: 25px; } .shortrunactive { background-image: url(../images/navigationimages/shortrun-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .shortruninactive { background-image: url(../images/navigationimages/shortrun-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .longrunperfectactive { background-image: url(../images/navigationimages/longperfect-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .longrunperfectinactive { background-image: url(../images/navigationimages/longperfect-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .longruncaseactive { background-image: url(../images/navigationimages/longcase-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .longruncaseinactive { background-image: url(../images/navigationimages/longcase-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .colouractive { background-image: url(../images/navigationimages/colour-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .colourinactive { background-image: url(../images/navigationimages/colour-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .specialistactive { background-image: url(../images/navigationimages/specialist-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .specialistinactive { background-image: url(../images/navigationimages/specialist-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .consultancyactive { background-image: url(../images/navigationimages/consultancy-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .consultancyinactive { background-image: url(../images/navigationimages/consultancy-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .designactive { background-image: url(../images/navigationimages/design-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .designinactive { background-image: url(../images/navigationimages/design-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .casestudyactive { background-image: url(../images/navigationimages/casestudies-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .casestudyinactive { background-image: url(../images/navigationimages/casestudies-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } .contactactive { background-image: url(../images/navigationimages/contact-active.gif); background-repeat: no-repeat; background-position: center 0; width: 107px; float: left; } .contactinactive { background-image: url(../images/navigationimages/contact-active.gif); background-repeat: no-repeat; background-position: -1000px 0; width: 107px; float: left; } /*Left Colum Content */ .leftcolumn { background-image: none; width: 605px; float: left; padding-left: 22px; } .leftcolumn h1 { font-size: 36px; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; font-weight: normal; margin: 5px 0 20px; } .leftcolumn h2 { font-size: 22px; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; font-weight: normal; line-height: normal; margin: 5px 0 20px; } .leftcolumncontent { color: #808080; font-size: 12px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 16px; padding-right: 280px; } .leftcolumncontent-wide { color: #808080; font-size: 12px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 16px; padding-right: 100px; } .leftcolumncontent-index { color: #808080; font-size: 12px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 16px; background-image: url(../images/home_book.jpg); background-repeat: no-repeat; background-position: center bottom; height: 388px; padding-right: 20px; display: block; } .leftcolumncontent-index ul { padding-left:15px;} .leftcolumncontent-index ul li { list-style-type: none; } .leftcolumn a:link, a:visited { color: #4682b4; text-decoration: underline; } .leftcolumn a:hover { color: #b22222; text-decoration: none; } /*Right Column Content*/ .rightcolumn { width: 370px; float: right; } .rightcolumn h3 { font-size: 25px; font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif; font-weight: normal; margin: 5px 0 20px; padding-left: 20px; } .rightcolumn p { color: #808080; font-size: 11px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 15px; padding-right: 20px; padding-left: 20px; } .rightcolumn ul { color: #808080; font-size: 11px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 15px; list-style-type: disc; list-style-position: outside; } .rightcolumn-index { width: 370px; float: right; } .rightcolumn-index p { color: #808080; font-size: 11px; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; line-height: 15px; padding-right: 10px; padding-left: 20px; } .samplebutton { padding-top: 20px; padding-left: 20px; } .samplebutton a:link, .samplebutton a:visited { background-image: url(../images/ss-cta.jpg); background-repeat: no-repeat; width: 322px; height: 110px; display: block; } .samplebutton a:hover { background-image: url(../images/ss-cta.jpg); background-repeat: no-repeat; background-position: 2px 2px; display: block; width: 322px; height: 110px; } .samplebutton strong { position: absolute; top: -200px; } #hpSamples { padding-left:25px; } #hpSamples div { float:left; width: 309px; margin-right: 17px; } #hpSamples div.samplebuttonpgindex-C { margin-right: 0px !important; } /*SPECIFIC CTA IMAGES*/ .samplebuttonpgspecial a:link, .samplebuttonpgspecial a:visited { background-image: url(../images/sample_special.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpgspecial a:hover { background-image: url(../images/sample_special.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpgcolour a:link, .samplebuttonpgcolour a:visited { background-image: url(../images/sample_colour.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpgcolour a:hover { background-image: url(../images/sample_colour.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpgshortrun a:link, .samplebuttonpgshortrun a:visited { background-image: url(../images/sample_short.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpgshortrun a:hover { background-image: url(../images/sample_short.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpglongcase a:link, .samplebuttonpglongcase a:visited { background-image: url(../images/sample_case.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpglongcase a:hover { background-image: url(../images/sample_case.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpglongperfect a:link, .samplebuttonpglongperfect a:visited { background-image: url(../images/sample_perfect.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpglongperfect a:hover { background-image: url(../images/sample_perfect.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpgdesign a:link, .samplebuttonpgdesign a:visited { background-image: url(../images/sample_design.gif); background-repeat: no-repeat; width: 322px; height: 107px; display: block; } .samplebuttonpgdesign a:hover { background-image: url(../images/sample_design.gif); background-repeat: no-repeat; background-position: -322px 0; display: block; width: 322px; height: 107px; } .samplebuttonpgindex-A a:link, .samplebuttonpgindex-A a:visited { background-image: url(../images/home_shortrun-new.gif); background-repeat: no-repeat; width: 337px; height: 98px; margin-bottom: 10px; display: block; } .samplebuttonpgindex-A a:hover { background-image: url(../images/home_shortrun-new.gif); background-repeat: no-repeat; background-position: -337px 0; display: block; width: 337px; height: 98px; margin-bottom: 10px; } .samplebuttonpgindex-B a:link, .samplebuttonpgindex-B a:visited { background-image: url(../images/home_longpaper-new.gif); background-repeat: no-repeat; width: 337px; height: 98px; margin-bottom: 10px; display: block; } .samplebuttonpgindex-B a:hover { background-image: url(../images/home_longpaper-new.gif); background-repeat: no-repeat; background-position: -337px 0; display: block; width: 337px; height: 98px; margin-bottom: 10px; } .samplebuttonpgindex-C a:link, .samplebuttonpgindex-C a:visited { background-image: url(../images/home_longrun-new.gif); background-repeat: no-repeat; width: 337px; height: 98px; margin-bottom: 10px; display: block; } .samplebuttonpgindex-C a:hover { background-image: url(../images/home_longrun-new.gif); background-repeat: no-repeat; background-position: -337px 0; display: block; width: 337px; height: 98px; margin-bottom: 10px; } #hpSamples .samplebuttonpgindex-A a:link, #hpSamples .samplebuttonpgindex-A a:visited { background-image: url(../images/shortRunSample.gif); background-repeat: no-repeat; width: 309px; height: 98px; margin-bottom: 10px; display: block; } #hpSamples .samplebuttonpgindex-A a:hover { background-image: url(../images/shortRunSampleOn.gif); background-position: 0 0;} #hpSamples .samplebuttonpgindex-B a:link, #hpSamples .samplebuttonpgindex-B a:visited { background-image: url(../images/longRunPaperSample.gif); background-repeat: no-repeat; width: 309px; height: 98px; margin-bottom: 10px; display: block; } #hpSamples .samplebuttonpgindex-B a:hover { background-image: url(../images/longRunPaperSampleOn.gif); background-position: 0 0;} #hpSamples .samplebuttonpgindex-C a:link, #hpSamples .samplebuttonpgindex-C a:visited { background-image: url(../images/longRunSample.gif); background-repeat: no-repeat; width: 309px; height: 98px; margin-bottom: 10px; display: block; } #hpSamples .samplebuttonpgindex-C a:hover { background-image: url(../images/longRunSampleOn.gif); background-position: 0 0;} /*Footer*/ .footer { color: #808080; font-size: 10px; background-color: white; background-image: url(../images/ss-footerstripes.jpg); background-repeat: no-repeat; background-position: 22px 0; height: 26px; clear: both; padding-top: 10px; padding-left: 250px; display: block; } .footer a:link, a:visited { color: #4682b4; text-decoration: underline; } .footer a:hover { color: #b22222; text-decoration: none; } .lightbox { line-height: 1px; position: absolute; left: -9000px; height: 1px; } .hiddenlightbox { display: none; } /*COLOURED PAGES AND BACKGOUNRD */ #pgshortrun { background-image: url(../images/ss-pagephotos-shortrun.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourshortrun { color: #6f9695; } #pglongpaper { background-image: url(../images/ss-pagephotos-longrunpb.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourlongpaper { color: #856369; } #pglongcase { background-image: url(../images/ss-pagephotos-longruncb2.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourlongcase { color: #b8a04f; } #pgcolour { background-image: url(../images/ss-pagephotos-colour.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourcolour { color: #4b8858; } #pgspecial { background-image: url(../images/ss-pagephotos-special.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourspecial { color: #ada5b3; } #pgapproach { background-image: url(../images/ss-pagephotos-approach.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourapproach { color: #69482b; } #pgdesign { background-image: url(../images/ss-pagephotos-design.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourdesign { color: #807f77; } #pgcase { background-image: url(../images/ss-pagephotos-case.jpg); background-repeat: repeat-y; background-position: right -5px; } #colourcase { color: #bdb475; } #pghome { } #colourhome { color: #837d6e; } #pgcontact { background-image: url(../images/ss-pagephotos-contact.jpg); background-repeat: no-repeat; background-position: right -5px; } #colourcontact { color: #b3715d; } .colourquote { color: #e9301d !important; } /*Form styling*/ .formspace label { font-size: 12px; width: 100px; float: left; padding-left: 10px; display: inline; } .formspace { padding-top: 5px; padding-bottom: 5px; } .other { display: inline; font-size: 0.1em; height: 1px; line-height: 0.1em; visibility: hidden; } .quotespace label { font-size: 12px; width: 170px; float: left; display: inline; } .quotePanel { padding: 10px; background: #eeeeee; margin-bottom: 10px; } .quotePanel h4 { margin: 0 0 10px; font-family: "Trebuchet MS", sans-serif; font-size: 14px; } .quotespace { padding: 5px 0; } .quoteSpecialspace { padding: 5px 0; } .quoteSpecialspace label { font-size: 12px; width: 400px; float: left; display: inline; } .compulsory { float: right; padding: 0 20px 0 0; background: url(../images/bulletCompulsory.jpg) no-repeat center right; font-size:10px; } .optional { float: right; padding: 0 15px 0 0; background: url(../images/bulletOptional.jpg) no-repeat center right; font-size:10px; } .quoteSelect { width: 300px; } .clear { clear: left; } .submitter { text-align: right; } collapseMe { height:16px; clear:both;} #collapsee { display:block; overflow:hidden; } /* UPDATE CTA BUTTONS FOR HP */ #knowWhatYouNeed { background: url(../images/know-what-you-need.gif) no-repeat; width: 309px; height:95px; text-indent:-999em; display:block; float:right; margin-right: 14px; margin-bottom: 10px; outline:none; } #specialOffer { background: url(../images/offer-free-delivery.gif) no-repeat; width: 309px; height:157px; text-indent:-999em; display:block; float:right; margin-right: 14px; margin-bottom: 2px; outline:none; } #childrensBookPrinting { background: url(../images/childrens-book-printing.jpg) no-repeat; width: 309px; height:224px; text-indent:-999em; display:block; float:right; margin-right: 14px; margin-bottom: 10px; outline:none; } #knowWhatYouNeed:hover { background: url(../images/know-what-you-need-on.gif) no-repeat; } #specialOffer:hover { background: url(../images/offer-free-delivery-on.gif) no-repeat; } #childrensBookPrinting:hover { background: url(../images/childrens-book-printing-on.jpg) no-repeat; } .quoter { display: block; width: 308px; height: 61px; outline: none; text-indent: -9999px; background: url(../images/getQuote.gif) no-repeat; margin: 10px 0 20px 22px;} .quoter:hover { background: url(../images/getQuoteHover.gif) no-repeat; }