/*==================================================================== Red Bullet Web Design Ltd Copyright 2010 Red Bullet Author: JR - Red Bullet ====================================================================== GLOBAL STYLE SHEET ======================================================================*/ /* RESETS */ * {margin: 0; padding: 0; border: 0;} ol,ul {list-style:none;} :focus {outline:0;} /* FONTS */ @font-face { font-family: 'Rockwell-2'; src: url('fonts/rock-webfont.eot'); src: local('?'), url('/fonts/rock-webfont.woff') format('woff'), url('/fonts/rock-webfont.ttf') format('truetype'), url('/fonts/rock-webfont.svg#webfontKcE1WRQD') format('svg'); font-weight: normal; font-style: normal; } /* Global Styles */ body {background:#F4F7DE; color:#333; font-family: Helvetica, Arial, sans-serif; font-size:12px; *width:100%; min-width:980px;} a {text-decoration:underline; color:#333;} a:hover {text-decoration:none;} a.btn {color:#fff; background:#EB9999; font-size:18px; text-decoration:none; padding:0 10px; line-height:32px;} a.btn:hover {color:#fff; background:#cc0000;} .clear {clear:both;} .right {float:right;} .left{float:left;} /* Grid */ .center {margin:0 auto; width:980px;} /* Backgrounds */ .greenBg {background-color:#B9D2BD;} .pinkBg {background-color:#F5CCCC;} .whiteBg {background-color:#FFF;} /* Text */ .txt14 {font-size:14px; line-height:21px;} .txt18 {font-size:18px; line-height:30px;} .txt24 {font-size:24px; line-height:36px;} .txt28 {font-size:28px; line-height:36px;} .txt32 {font-size:32px; line-height:42px;} #page h1 span, #page h2 span {color:#c00; font-weight:bold;} /* Tab Controllers */ .tabs-hide {display:none;} /* Rockwell Font Stack */ #titleBar h1 , #titleBar h2, #question h4, #subtitleBar h2, .sidebar-box h2, #pm-job #page h1, #pm-job #titleBar h6, #servicesTabs .tab h2, #process div.content h2, #workTabs .tab h1, #page.casestudy h3, #page.contact h2, #page.contact h3, #page.contact label, #formBox form button, body#blog #sidebar h3, #titleBarHome h1, #jobsBoard h2, #article h1, #clientLogos h4 span, #workTabs .tab .intro, #successMsg h4, #successMsg p, .foot-box h4, #slaBox h3, #contactDetails h2, #bio p.links span {font-family:Rockwell, 'Rockwell-2', helvetica, arial, sans-serif; font-weight:normal;} /*====================================================================== BASE ======================================================================*/ #topBar {background:#333 url(/images/base/topbarBg.png) repeat-x; height:50px; *width:100%;min-width:100%;} #titleBar, #titleBarHome {*width:100%; min-width:100%;height:90px; border-bottom:2px dotted #8E7F78; background-image:url(/images/base/titleBarShadow.png); background-repeat:repeat-x; *background-image:none;} #logo {float:left; height:48px; width:180px;overflow:hidden;} #page {margin:0 auto; width:980px;} #footer {*width:100%;min-width:100%; clear:left; float:left;margin-top:60px;border-top:2px dotted #8E7F78;background-color:#B9D2BD;} /* Logo */ #logo a {width:140px; display:block; font-size:0px; padding-top:50px; background: url(/images/base/logo.png) 0 0 no-repeat; margin-left:16px;text-indent:-9999px; height:0;} #logo a:hover, #logo.active a {background-position: bottom left;} /* Nav */ #mainNav {float:left; width:auto;} #mainNav li {float:left; line-height:50px; margin:0 10px; width:auto;} #mainNav li a {font-size:16px; color:#ccc; font-weight:bold; text-decoration:none; height:50px; display:block; *display:inline;padding:0 10px;text-shadow:-1px -1px #000;} #mainNav li a:hover, #mainNav li.active a {color:#fff;} #subNav {padding-left:20px; *padding-left:0; float:left;} #subNav li {float:left; line-height:50px; margin:0 10px;} #subNav li a {font-size:14px; color:#999;text-decoration:none;text-shadow:-1px -1px #000; } #subNav li a:hover, #subNav li.active a {color:#fff;} /* Title Bar Styles */ #titleBar h1 , #titleBar h2 {font-size:36px;line-height:90px;padding:0 20px;} #titleBar h1 span, #titleBar h2 span {color:#F4F7DE;padding-right:7px;} #titleBar h1 span a {color:#F4F7DE; text-decoration:none;} #titleBar h1 span a:hover {text-decoration:underline;} /* Footer Styles */ .foot-box {width:auto; float:left;padding:50px 0 5px 20px;height:135px;} .foot-box h4 {font-size:24px;padding-bottom:10px;} .foot-box p {font-size:16px; line-height:24px;} .foot-box a.btn {margin-top:15px; float:left; width:auto;line-height:32px;} #footer #contactInfo {width:380px;} #footer #contactInfo h4 {background: url(/images/base/footer-logo.png) 0 0 no-repeat; height:0;margin:5px 0 15px;overflow:hidden;padding:18px 0 0;} #footer.home #contactInfo h4 {background: url(/images/base/footer-logo-home.png) 0 0 no-repeat; } #footer #contactInfo a {color:#333;} #footer #contactInfo a:hover {color:#c00;} #footer #contactInfo p {width:180px; float:left;} #footer #contactInfo p#us {border-right:1px solid #999999;margin-right:15px;padding-right:13px;width:155px;} #footer #rush {width:245px; margin-right:20px; background: url(/images/base/icon-footer-download.png) bottom right no-repeat;} #footer #newProject {width:250px; background: url(/images/base/icon-footer-msg.png) bottom right no-repeat;} #footer.home {position:absolute; top:890px; background:none; border:0; margin-top:0;} #footer.home #rush {background: url(/images/base/icon-footer-download-pink.png) bottom right no-repeat;border-left:3px dashed #B9D2BD; } #footer.home #newProject {background: url(/images/base/icon-footer-msg-pink.png) bottom right no-repeat;border-left:3px dashed #B9D2BD;} #footer.home .center {border-top: 3px dashed #B9D2BD;} #footer.home .foot-box {padding:20px 0 5px 20px;} #footer #copy {clear:both; padding:50px 20px 20px;} /*====================================================================== HOME ======================================================================*/ #titleBar.home {height:20px; border:none;} #page.home {padding-top:10px;} #strap {*width:100%;min-width:100%;height:225px; position:absolute; z-index:-1; top:345px;border-top:2px dotted #8E7F78;border-bottom:2px dotted #8E7F78;left:0;} #strap h2 {width:945px;background:url(/images/base/strap.png) 0 0 no-repeat;font-size:0;margin:20px 20px 0;padding-top:180px; height:0; text-indent:-9999px;} #question {float:left; width:420px;} #question h4 {color:#cc0000;font-size:32px;padding:0 20px;} #question h3 {font-size:32px; line-height:38px;font-weight:normal; background:url(/images/base/bg-question.png) 0 0 no-repeat;padding:30px 20px 17px;} #question #videoInfo {margin-top:10px;padding:0 20px;} #question #videoInfo p {color:#8E7F78; font-size:12px;line-height:16px;padding:0 0 10px 30px; background:url(/images/base/infoIcon.png) 0 0 no-repeat; } #video {width:533px; height:300px; background:#FFF; float:right; padding:10px;} #clientLogos {position:absolute;top:610px;width:960px; padding:0 0 0 20px;clear:both;} #clientLogos h4 {font-weight:normal; font-size:18px; padding-bottom:30px; float:left; width:auto; display:inline;} #clientLogos h4 span {font-size:24px;} #clientLogos #workBtn { float:right; width:auto; padding:0px 15px; height:32px;line-height:32px; margin-right:20px;} #clientLogos ul {background:url(/images/base/client-logo-block.png) 0 bottom no-repeat; width:960px; height:170px;position:relative;} #clientLogos ul li {font-size:0; height:0; text-indent:-9999px;} /*====================================================================== ABOUT ======================================================================*/ body#about #titleBar {text-align:center; border:none;} body#about #titleBar h1 {font-size:42px;} #teamGallery {height:270px;border-bottom:2px dotted #8E7F78;overflow:hidden;} #teamGallery ul {width:1000px; margin:0 auto;} #teamGallery ul li {width:55px; float:left;} #teamGallery ul li.pt20 {padding-top:20px; } #teamGallery ul li.pt10 {padding-top:10px;} #teamGallery ul li.pr5 {padding-right:5px;} #teamSplit {left:-10px;margin:10px 0 0;position:relative;width:1000px;} #teamSplit h4 {font-size:0; height:0; float:left;overflow:hidden; text-indent:-9999px;} #teamSplit h4#nine {width:500px; padding-top:20px; background:url(/images/base/bg-leftbrain.png) 0 0 no-repeat;} #teamSplit h4#six {width:340px; padding-top:30px; background:url(/images/base/bg-rightbrain.png) -2px 0 no-repeat;} #teamSplit h4#three {width:160px; padding-top:40px; background:url(/images/base/bg-allround.png) -6px 0 no-repeat;} #teamSplit h4#all {width:145px; clear:both; float:none; padding-top:30px; margin:0 auto; background:url(/images/base/bg-allhuman.png) 0 0 no-repeat;} #thanksList {margin:30px 0 60px; width:980px; float:left;} #thanksList h6 {font-size:24px;line-height:40px; font-weight:normal; width:160px; float:left; font-style:italic; padding:0 0 0 20px;} #thanksList ul {width:740px; float:right; font-size:24px; line-height:40px;} #thanksList ul li {padding:0 15px;} #thanksList ul li a {color:#333;} #thanksList ul li a:hover {color:#B9D2BD;} .tipTrigger {text-decoration:none;} .tooltip {padding: 0 2px 2px 7px; display:none;} .tooltip .body {border:1px solid #ccc; background:#FFF;padding:5px; color:#cc0000; text-align:center; font-size:14px;line-height:normal;} .tooltip .image { height: 100px; width: 160px;} .tooltip .link {padding-bottom: 5px;} #subtitleBar {width:100%;clear:both;border-bottom:2px dotted #8E7F78;border-top:2px dotted #8E7F78; text-align:center; height:60px;} #subtitleBar h2 {width:960px; font-size:36px;line-height:56px; padding:0 2px;color:#F4F7DE;background: url(/images/base/bg-star.png) -2px 20px repeat-x; } #subtitleBar h2 span {padding:0 25px; background:#B9D2BD;} #coreTeam {clear:both; padding-top:20px;} #coreTeam div {float:left; width:220px; padding:30px 15px 0 10px;} #coreTeam .avatar {display:block;width:202px; height:202px;padding:9px; margin-bottom:10px;background:#fff; } #coreTeam img {width:200px; height:200px; border:1px solid #e2e2e2;} #coreTeam h3 {font-size:18px;padding:10px 10px 0px;} #coreTeam h3 a {text-decoration:none;} #coreTeam h3 a:hover {text-decoration:underline;} #coreTeam h6 {font-size:14px; color:#cc0000;font-weight:normal;line-height:20px; padding:0 0 0 10px;} #coreTeam p {font-size:12px; line-height:18px; padding:20px 10px 0;} #coreTeam div p a.btn {font-size:14px; padding:0 4px} /* Bio Page Styles */ #team #page {position:relative;} #team #footer {margin:0;} #team .craig {background:url(/images/base/bg-bio-craig.jpg) right top no-repeat;height:550px;} #team .jim {background:url(/images/base/bg-bio-jim.jpg) right top no-repeat;height:660px;} #team .andy {background:url(/images/base/bg-bio-andy.jpg) right top no-repeat;height:720px;} #team .lou {background:url(/images/base/bg-bio-lou.jpg) right top no-repeat;height:595px;} #team .natalie {background:url(/images/base/bg-bio-natalie.jpg) right top no-repeat;height:630px;} #team .geoff {background:url(/images/base/bg-bio-geoff.jpg) right top no-repeat; height:660px;} #team .simon {background:url(/images/base/bg-bio-simon.jpg) right 20px no-repeat; height:680px;} #team .kev {background:url(/images/base/bg-bio-kev.jpg) right top no-repeat;height:595px;} #team .anna {background:url(/images/base/bg-bio-anna.jpg) right top no-repeat;height:540px;} #team .sarah {background:url(/images/base/bg-bio-sarah.jpg) right top no-repeat;height:540px;} #team .bev {background:url(/images/base/bg-bio-bev.jpg) right top no-repeat;height:660px;} #team .helen {background:url(/images/base/bg-bio-helen.jpg) right top no-repeat;height:660px;} #bio {width:500px; padding:40px 20px 0; float:left;} #bio h3 {font-size:32px; font-weight:normal; line-height:42px;} #bio h4 {font-size:18px;border-bottom:2px dotted #8E7F78;margin:0 0 20px 0;} #bio p {font-size:16px; line-height:21px; padding-top:15px;} #bio p.links {border-top:2px dotted #8E7F78; margin-top:30px; width:480px; font-size:14px;} #bio p.links span {padding-right:5px;} #bio p.links a {color:#cc0000;} #nameLabel {background:#fff; width:200px; padding:10px 20px; position:absolute; right:0; bottom:100px} #nameLabel h2 {padding-bottom:5px;} #nameLabel h4 {color:#cc0000; font-weight:normal;font-size:14px;} /*====================================================================== SERVICES ======================================================================*/ #page.services ul#menu {margin:43px 0 0 15px; width:150px; float:left;} #page.services ul#menu li {padding-bottom:10px; margin-bottom:5px; height:32px;} #page.services ul#menu li a {width:auto; color:#fff; background:#EB9999; font-size:18px; text-decoration:none; padding:0 10px; display:block;height:32px;line-height:32px;text-align:center;opacity:0.6;} #page.services ul#menu li a:hover {opacity:1;} #page.services ul#menu li.active a {background:#c00; opacity:1;} #page.services .tab {width:780px; float:right; padding:30px 0 30px 20px; margin-top:10px;} #page.services .tab h2 {font-size:36px; line-height:44px;} #page.services .tab h2 span {color:#cc0000;} #page.services .tab h3 {font-size:28px; line-height:36px; font-weight:normal;} #page.services .tab h4 {font-size:21px; line-height:30px; font-weight:normal;} #page.services .tab p {padding-bottom:20px; font-size:18px;line-height:24px;} #page.services .tab .col2 {width:360px; padding-right:30px; float:left;} #page.services .tab .col2.wide {width:440px;} #page.services .tab .col2.narrow {width:280px;} #page.services .tab .col2 p {padding:10px 0;} #page.services .tab ul {padding:20px 0; float:left;} #page.services .tab li {list-style:disc inside none;} #page.services .tab ul.options {float:right;width:240px; padding:15px; font-size:14px; line-height:24px;} #page.services .tab ul.options li.title {list-style:none; font-size:18px; margin-bottom:10px;} #page.services .tab .col2 img {width:340px; height:230px; border:10px solid #fff;} #page.services #services {background: url(/images/base/bg-brain.png) 260px 20px no-repeat; height:500px;} #page.services #services h3 {float:right; width:auto; text-align:right; padding-top:20px;} #page.services #services p {position:relative; left:-120px;width:442px; top:130px;height:160px;background: url(/images/base/bg-services-prefer.png) 0 0 no-repeat; } #page.services #services p span {display:none;} #page.services #research #enables-us {background: url(/images/base/bg-enables-us.png) 0 0 no-repeat; text-indent:-9999px; height:190px;} #page.services #research h3 {padding-bottom:30px;} #page.services #research .col2 img {width:340px; height:230px; border:10px solid #fff;} #page.services #research #note {background: url(/images/base/bg-research-note.png) center center no-repeat; text-indent:-9999px; height:30px;} #page.services #strategy {background: url(/images/base/bg-strategy.png) 630px 50px no-repeat;} #page.services #strategy ul li {width:300px; float:left; padding-right:20px; margin-bottom:5px; font-size:18px;} #page.services #strategy #note {background: url(/images/base/bg-strategy-note.png) center center no-repeat; text-indent:-9999px; height:60px; float:right; width:180px; position:relative; top:-50px;} #page.services #usability .col4 {font-size:14px; width:175px; float:left;padding:00px 20px 30px 0; line-height:21px;} #page.services #usability .col4 img {width:175px; height:80px;} #page.services #usability h4 {padding:20px 0 10px;} #page.services #usability h3 {width:460px; float:left; padding-top:10px;} #page.services #access h2 {padding-bottom:20px;} #page.services #access #note {background: url(/images/base/bg-note-access.png) center center no-repeat; text-indent:-9999px; height:40px;} #page.services #design {background: url(/images/base/bg-design.png) 20px 10px no-repeat;} #page.services #design h3.sub {padding:20px 0 60px;} #page.services #design .col3 {background: url(/images/base/bg-design2.png) 20px bottom no-repeat; height:360px;} #page.services #design .col3 p {width:215px; float:left; padding:20px 50px 0 0;} #page.services #design .col3 p.alt {padding-right:0;} #page.services #design h4 {padding-top:10px;} #page.services #dev h2.left {text-align:right;padding-right:10px;width:440px;} #page.services #dev h2.right {color:#B9D2BD; border-left:10px solid #E5F0DB; padding-left:15px;width:300px;} #page.services #dev .col2 {padding-top:30px;} #page.services #dev .col2 h4 {padding-top:10px;} #page.services #marketing {background: url(/images/base/bg-marketing.png) 570px 40px no-repeat;} #page.services #marketing h2 {padding-bottom:20px;} #page.services #marketing h3 {padding-bottom:30px;} /*====================================================================== PROCESS ======================================================================*/ #page.process {margin-top:10px; margin-bottom:50px} #process {float:left; width:980px; padding-bottom:120px;} #process div.step {width:980px; float:left;padding-top:40px; margin-bottom:-40px;} #process ul.menu {padding:55px 0 0 15px; width:150px; float:left;} #process ul.menu li {padding-bottom:10px; margin-bottom:5px; height:32px;position:relative;} #process ul.menu li a {width:100px; color:#fff; background:#EB9999; font-size:18px; text-decoration:none; padding:0 10px; display:block;height:32px;line-height:32px;text-align:center;opacity:0.6;} #process ul.menu li a:hover {opacity:1;} #process ul.menu li.active a {background:#c00; opacity:1;} #process ul.menu li.active span {border-bottom:2px dashed #CC0000;display:block;height:15px;top:0;width:30px;position:absolute;right:0;} #process div.content {float:left; width:798px;border-left:2px dashed #cc0000;padding-bottom:210px;} #process div.content h2 { color:#cc0000;font-size:32px;top:-15px; position:relative;} #process div.content h2 span {border-top:2px dashed #CC0000;display:block;float:left;position:relative;top:17px;width:30px;} #process div.content h3 {font-size:36px; color:#534741;line-height:42px; font-weight:700;} #process div.content h3 strong {color:#000;} #process div.content h3 span {color:#c00;} #process div.content p {font-size:18px; line-height:24px;} #process div.content p.note {height:0; font-size:0; overflow:hidden;text-indent:-9999px;} #process div.content img {background:#fff; border:5px solid #fff;} #process div.content .w740 {width:740px; padding:0 0 0 30px;} #process div.content .w340 {padding:30px 0 30px 30px;width:369px;} #process div.content .w215 {width:215px; padding:0 10px 0 30px; float:left;} /* Research */ #process #research div.intro {padding:0 0 0 30px; float:left;width:740px;} #process #research h3 {width:280px; height:170px; padding:15px 20px; } #process #research h3.left {padding:15px 20px 15px 10px;text-align:right;width:290px;} #process #research h3.right {text-align:left;} #process #research p.middle {width:100px;height:0;float:left;padding-top:180px; background:url(/images/base/bg-tricky-space.png) center top no-repeat; font-size:0;overflow:hidden;text-indent:-9999px;} #process #research p.note {float:right; background:url(/images/base/bg-note-research.png) 0 0 no-repeat; padding-top:44px; width:380px;margin-top:5px;} #process #research div.detail {float:left;padding:30px 0 0 30px; width:auto;} #process #research div.detail img { background:#fff; border:5px solid #fff; width:180px; height:140px; display:block; float:left;} #process #research div.detail p { padding:5px 30px; width:300px; float:left;} /* Plan */ #process #plan p.pinkBg {font-size:14px;margin:30px 14px 0 15px;padding:15px;width:325px; float:left;} #process #plan p.note {width:742px; padding-top:240px;background:url(/images/base/bg-note-plan.png) 0 0 no-repeat; margin:30px 0 0 20px;} /* Prototype */ #process #proto div.intro p {font-size:28px; line-height:36px;} #process #protoTabs {float:left; height:140px;} #process #protoTabs div {width:515px; float:left;} #process #protoTabs ul {float:right; width:195px; background:url(/images/base/bg-note-warning.png) center bottom no-repeat; padding:5px 15px 85px;} #process #protoTabs ul li.tabs-selected {display:none;} #process #protoTabs ul li a {background:#EB9999;color:#F4f7e4;display:block;font-size:21px;height:32px; line-height:32px;padding:2px 20px;text-align:center;text-decoration:none;} #process #protoTabs ul li a:hover { background-color:#cc0000;} #process #proto div.detail {clear:left;} #process #proto div.detail img { float:left; width:215px; height:175px;margin:20px 0 0 31px;} #process #proto div.detail p { margin:0 30px 0;} #process #proto div.detail p.note {background:url(/images/base/bg-note-proto.png) 0 0 no-repeat; padding-top:22px; width:700px; margin:10px 0 0 40px; *margin:10px 0 0 20px;float:left;} /* Build */ #process #build div.content {background:url(/images/base/bg-build.png) 18px 125px no-repeat;} #process #build div.content h4 {font-size:28px; line-height:36px; margin-left:30px;} #process #build div.detail {height:450px; width:740px; margin-left:30px; position:relative;} #process #build div.detail p {padding:10px 15px; position:absolute;} #process #build div.detail p.left {width:200px;top:28px;} #process #build div.detail p.right {width:160px;right:0;top:173px;} /* Test */ #process #test div.w215 p {font-size:14px; line-height:24px; margin-top:10px;} #process #test div.w215 p.note {background:url(/images/base/bg-note-test.png) 0 0 no-repeat; width:215px; padding-top:190px; margin-top:25px} /* Deploy */ #process #deploy div.content {background:url(/images/base/bg-deploy.png) 30px 0 no-repeat;} #process #deploy div.content h3 {font-size:28px; line-height:38px;} #process #deploy div.content div.w340 {float:left; margin-top:30px;} #process #deploy div.content div.w740 {margin-bottom:40px;} #process #deploy div.content p.pinkBg {font-size:14px; padding:10px 15px 10px 85px; background:#F5CCCC url(/images/base/bg-copyright.png) 10px 0 no-repeat;margin-top:25px; } /* Support */ #process #support div.content {background:url(/images/base/bg-support.png) 30px 165px no-repeat;} #process #support p.note {padding-top:280px;} #process #support div.content h3 {float:left; clear:left;} #process #support div.content div.left {padding:0 0 0 30px; float:left;width:500px;} #process #support div.content div.right {width:260px; height:370px; background:url(/images/base/bg-sla.png) 0 0 no-repeat;margin-top:10px;clear:right;} #process #support div.content div.right p {font-size:14px; padding:130px 15px 0;} /* Review */ #process #review div.content {height:195px;} #process #review div.content .bgHolder {background:transparent url("/images/base/bg-review.png") no-repeat scroll 30px 10px ;float:left;height:475px;width:794px;position:absolute;} #process #review div.content h3 {font-size:28px; line-height:38px; padding:0 0 0 30px;} #bttBtn a {background:none repeat scroll 0 0 #EB9999;color:#FFFFFF;display:block;font-size:14px;font-weight:bold;height:32px;line-height:32px;opacity:0.6;padding:0 10px;text-align:center;text-decoration:none;width:100px;clear:both; margin:0 15px; position:relative;} #bttBtn a:hover {background-color:#cc0000;opacity:1;} #bttBtn a span {font-size: 0px; line-height: 0%; width:0px; position:absolute; top:-20px; left:40px;border-bottom: 15px solid #EB9999;border-left: 20px solid #F4F7DE;border-right: 20px solid #F4F7DE;} #bttBtn a:hover span {border-bottom: 15px solid #c00;} /*====================================================================== WORK ======================================================================*/ #workTabs #menu {float:right; width:360px; position:relative; top:-42px; height:43px;} #workTabs #menu li {float:left; width:auto; height:42px; margin-right:15px;} #workTabs #menu li a {padding:0 15px; line-height:40px;display:block; font-size:18px; font-weight:bold; text-decoration:none;color:#B9D2BD; background:#E5F0DB; border-bottom:2px dotted #8E7F78;} #workTabs #menu li a:hover {background:#F4F7DE;} #workTabs #menu li.tabs-selected, #workTabs #menu li.active {height:40px;} #workTabs #menu li.tabs-selected a, #workTabs #menu li.active a {background:#F4F7DE; color:#8E7F78; padding-bottom:12px;border-bottom:2px solid #F4F7DE;} #workTabs .tab {width:980px;padding:20px 0;} #workTabs .tab h1 {font-size:36px;line-height:90px; padding:0 20px; position:absolute; top:50px;} #workTabs .tab h1 span {padding:0 0 0 90px; color:#F4F7DE;} #workTabs .tab .intro {border-bottom:2px dotted;clear:both;font-size:24px;font-weight:normal;line-height:24px;margin:0 0 30px 20px;padding:20px 0 5px;width:920px;} #workTabs #list .item {margin-bottom:40px; float:left;} #workTabs #list .item .thumb {width:580px; height:280px; overflow:hidden;float:left; background:#fff; border:10px solid #fff; margin:0 10px; *margin:0 5px; position:relative;} #workTabs #list .item .thumb img {float:left; width:580px;} #workTabs #list .item .thumb a {width:578px; height:278px; border:1px solid #e2e2e2; display:block; position:absolute; top:0; left:0;} #workTabs #list .item .thumb a span.hover {background:url(/images/base/bg-case-study-hover.png) 0 0 no-repeat; background:none; display:block;height:278px; } #workTabs #list .item .details {padding:15px; width:330px; float:right;} #workTabs #list .item .details h2 {font-size:24px;} #workTabs #list .item .details h6 {font-size:14px; font-weight:normal; margin-top:5px;} #workTabs #list .item .details h6 a {color:#cc0000;} #workTabs #list .item .details p { font-size:14px; line-height:21px; padding:20px 0;border-bottom:2px dotted #8E7F78; } #workTabs #list .item .details a.btn {margin-top:10px; float:left; height:32px;line-height:32px; padding:0 15px; } #workTabs #gallery .item {width:300px; margin:0 10px 30px; height:200px; background:#fff; float:left;} #workTabs #gallery .blank {width:300px; margin:0 10px 30px; height:200px; background:#F1F1Ce; float:left;} #workTabs #gallery .item .thumb img {width:280px; height:180px; border:10px solid #fff;} #ZoomImage {border:10px solid #FFFFFF;} /*====================================================================== CASE STUDY ======================================================================*/ body#casestudy #page {padding-top:30px;} #page.casestudy h3 {font-size:18px; } #page.casestudy #intro {width:580px; padding:0 20px; float:left;} #page.casestudy #breakdown {width:360px; float:right;} #page.casestudy #featuresTabs {margin-top:30px; float:left;position:relative;width:980px;} #page.casestudy #details {width:360px; float:right; margin-top:30px; clear:right;} #page.casestudy #featTitle {float:right; margin:0 0 10px; width:340px;} #page.casestudy #breakdown {width:330px; float:right; background:url(/images/base/breakdownBg.png) 0 0 no-repeat; height:110px; padding:10px;} #page.casestudy #breakdown h3 {background:url(/images/base/infoIcon.png) 0 0 no-repeat; line-height:24px; color:#B9D2BD; padding-left:30px;} #page.casestudy #breakdown ul {margin-top:10px;} #page.casestudy #breakdown li {color:#8E7F78; border-top:1px solid #B9D2BD; text-transform:uppercase; letter-spacing:2px;line-height:26px; height:26px; position:relative;} #page.casestudy #breakdown li span {width:180px; float:right;font-size:0px; padding-top:14px;line-height:0px; position:absolute;right:0;top:6px;} #breakdown li span {background-image:url(/images/base/BDchartBg.png);} .orangeLine-0 span {background-position:-184px bottom;} .blueLine-0 span {background-position:-184px -23px;} .purpleLine-0 span {background-position:-184px top;} .orangeLine-1 span {background-position:-166px bottom;} .blueLine-1 span {background-position:-166px -23px;} .purpleLine-1 span {background-position:-166px top;} .orangeLine-2 span {background-position:-147px bottom;} .blueLine-2 span {background-position:-147px -23px;} .purpleLine-2 span {background-position:-147px top;} .orangeLine-3 span {background-position:-129px bottom;} .blueLine-3 span {background-position:-129px -23px;} .purpleLine-3 span {background-position:-129px top;} .orangeLine-4 span {background-position:-111px bottom;} .blueLine-4 span {background-position:-111px -23px;} .purpleLine-4 span {background-position:-111px top;} .orangeLine-5 span {background-position:-92px bottom;} .blueLine-5 span {background-position:-92px -23px;} .purpleLine-5 span {background-position:-92px top;} .orangeLine-6 span {background-position:-74px bottom;} .blueLine-6 span {background-position:-74px -23px;} .purpleLine-6 span {background-position:-74px top;} .orangeLine-7 span {background-position:-55px bottom;} .blueLine-7 span {background-position:-55px -23px;} .purpleLine-7 span {background-position:-55px top;} .orangeLine-8 span {background-position:-37px bottom;} .blueLine-8 span {background-position:-37px -23px;} .purpleLine-8 span {background-position:-37px top;} .orangeLine-9 span {background-position:-18px bottom;} .blueLine-9 span {background-position:-18px -23px;} .purpleLine-9 span {background-position:-18px top;} .orangeLine-10 span {background-position:0 bottom;} .blueLine-10 span {background-position:0 -23px;} .purpleLine-10 span {background-position:0 top;} #featuresTabs h3, #featTitle {margin:0 0 20px 20px; font-size:24px;border-bottom:2px dotted #8E7F78;} #featuresTabs .tab {width:582px; float:left; background:#fff; margin:0 10px; *margin:0 5px; padding:9px; position:relative; top:-40px; *top:-20px;} #featuresTabs .tab img {border:1px solid #e2e2e2;} #featuresTabs #featuresList {width:360px; float:right;clear:right;} #featuresList h3 a {font-family:Helvetica, Arial, sans-serif; float:right; font-size:14px;margin-top:5px;padding:2px 6px;} #featuresList li {margin:10px 0 0 10px; width:350px; float:left;} #featuresList li a {width:auto; padding:0 10px; font-size:18px; color:#FFF; text-decoration:none;background:url(/images/base/bg-features-list-btns.png) top left no-repeat; line-height:32px;display:block;} #featuresList li a:hover {background-color:#cc0000; background:url(/images/base/bg-features-list-btns.png) bottom left no-repeat;} #featuresList li p {display:none; font-size:14px; line-height:21px; padding-top:10px;} #featuresList li.tabs-selected {background:#fff; left:-10px; *left:0px;padding:15px 15px 15px 30px;position:relative;width:325px; margin:15px 0 5px;z-index:-1;} #featuresList li.tabs-selected a {color:#333; background:none; padding:0; cursor:text; line-height:20px;} #featuresList li.tabs-selected a:hover {background:none;} #featuresList li.tabs-selected p {display:block;} #page.casestudy #details li {padding:0 0 10px 20px;width:270px;clear:left;display:block;} #page.casestudy #details li span {color:#756C67;display:block;float:left;width:70px;} #page.casestudy #details li a {color:#333;} #page.casestudy #details #download {width:56px; height:80px; margin:0; position:absolute; right:0;} #page.casestudy #details #download a {width:56px; height:0; overflow:hidden; padding-top:80px; font-size:0px; background:url(/images/base/caseStudyBtn.png) 0 0 no-repeat; display:block;} #page.casestudy #details #download a:hover {background:url(/images/base/caseStudyBtn.png) 0 -80px no-repeat;} /*====================================================================== Products ======================================================================*/ .product {padding:30px 0 50px;background:url(/images/base/bg-shelf.png) no-repeat bottom;margin-bottom:20px;} .product .details {width:440px; padding:20px; float:left;} .product h2 {font-size:24px;} .product h4 {font-size:14px; font-weight:normal; color:#c00;padding:5px 0 0;} .product p {font-size:16px; line-height:24px; padding:20px 0 0;} .details ul {font-size:14px; padding:15px 0 0 0; width:440px;} .details ul li {float:left;width:210px;line-height:21px;list-style:inside; margin-right:10px;} .product .btn {margin:20px 0 0;padding:0px 10px; float:left; clear:left;} .product .shelf {background:#B9D2BD;clear:both;height:20px;position:relative;top:-3px;} .screenshots {width:470px; height:380px;background:#fff; float:left; position:relative;margin-top:40px;} .screenshots ul {list-style:none;padding:20px 0 0 10px; position:absolute; top:-45px;width:460px; right:0;} .screenshots ul li {width:auto; font-size:14px; font-weight:bold; padding-right:5px;line-height:26px; float:left;} .screenshots ul li a {background:#EB9999; color:#fff; text-decoration:none;padding:5px 15px; } .screenshots ul li a:hover {background:#c00; color:#fff;} .screenshots ul li.tabs-selected {position:relative; z-index:1;} .screenshots ul li.tabs-selected a {background:#fff; color:#333;} .screenshots .thumb {width:450px; height:360px;padding:9px; border:1px solid #e2e2e2;} .screenshots div {float:left; width:auto;} /*====================================================================== Support ======================================================================*/ #support-options {padding:40px 20px 10px; width:660px; float:left;} #support-options h2 {font-size:24px; line-height:36px; padding-bottom:20px;} #support-options h3 {font-size:18px; line-height:28px; padding-bottom:5px; font-weight:normal;} #support-options p {font-size:14px; line-height:21px; padding-bottom:20px;} #support-sidebar {float:right;width:260px; margin:30px 0;} #contactDetails {padding:20px;width:220px;} #contactDetails h2 {color:#F4F7DE; font-size:24px; padding-bottom:10px;} #contactDetails h3 {font-size:21px; font-weight:normal;} #contactDetails .btn {float:left;line-height:32px;margin:10px 0 20px;} #contactDetails img {float:left; margin-right:15px; padding:5px; width:50px; height:50px; background:#fff;} #contactDetails p.hours {height:20px;padding-bottom:18px;} #contactDetails p.pm {clear:both;height:60px;line-height:18px;padding:10px 0;width:auto;} #contactDetails p strong {font-size:14px;} #contactDetails small {padding-bottom:20px;} #slaBox {padding:20px;width:660px; clear:left;} #slaBox h3 {font-size:24px;line-height:20px;padding:0 0 15px;font-weight:normal; } #slaBox p {line-height:21px;} /*====================================================================== Careers ======================================================================*/ #page.careers h2 {font-weight:normal; } .careers .content {float:left;padding:40px 20px 10px; width:660px;} .content h2 {padding-bottom:20px;} .content h3 {font-size:18px;line-height:28px;padding-bottom:5px;} .content p {font-size:14px;line-height:21px;padding-bottom:20px;} .content a {color:#333;} .content ul {padding-bottom:20px;padding-left:15px;list-style:outside;} .content li {font-size:14px;line-height:21px;padding-bottom:10px;} .content a.btn {color:#fff;} #page.careers .sidebar {float:right;width:260px; margin:30px 0;} #page.careers #jobsBoard {padding:20px;width:220px;} #jobsBoard h2 {font-size:24px;line-height:20px;padding:0 0 15px;font-weight:normal;color:#cc0000;} #jobsBoard h3 {font-size:21px;padding:0 0 5px;} #jobsBoard h6 {font-size:14px;line-height:24px;font-weight:normal;} #jobsBoard p {padding:15px 0 0;line-height:20px;} #jobsBoard a.btn {margin-top:15px; float:left;} #jobDetails h3 {font-size:21px;line-height:42px;} #jobDetails a.btn {margin-top:15px; float:left;} .sidebar-box {padding:20px; width:220px; margin-top:30px;} .sidebar-box h2 {font-size:24px;} .sidebar-box p {font-size:14px; line-height:21px;padding-top:10px;} .sidebar div.greenBg h2 {color:#F4F7DE;} #pm-job #titleBar {height:930px;} #pm-job #titleBar .center {text-align:center;background:url("/images/base/bg-arrow-big.png") no-repeat center bottom; padding-bottom:45px;} #pm-job #titleBar .dash {width:488px; border-right:4px dashed #F4F7DE; float:left; height:620px; margin-top:78px;position:absolute;} #pm-job #titleBar h6 {color:#F4F7DE; padding:20px; font-size:48px;width:auto;position:relative;z-index:1;} #pm-job .number1, #pm-job .number2, #pm-job .number3 {background:#B9D2BD url("/images/base/bg-numbers.png") no-repeat; height:42px;display:block;width:auto; position:relative;z-index:1;margin:50px 0 0; padding-bottom:10pxl} #pm-job .number1 {background-position:center top ;} #pm-job .number2 {background-position:center center;} #pm-job .number3 {background-position:center bottom;} #pm-job #titleBar p {font-size:28px;font-weight:bold;line-height:36px; background:#B9D2BD;width:auto; position:relative;z-index:1;margin:0 0 65px;} #pm-job #titleBar span {color:#cc0000;} #pm-job #page h1 {border-bottom:2px dashed #8E7F78;font-size:24px;margin-left:15px;padding:40px 0 0;text-align:center;margin-bottom:20px;} #pm-job #page h1 span {background:url("/images/base/bg-pm-job-title.png") no-repeat scroll center center transparent; display:block;padding:20px 0 10px;text-indent:-9999px;} /*====================================================================== Contact ======================================================================*/ #page.contact {margin:0 auto;} #formBox {width:560px; margin:40px 0 0; background:#fff; padding:18px; border:2px dashed #B9D2BD; float:left; position:relative;} #formBox #scissors {position:absolute; height:46px; width:60px; background:url(/images/base/scissors.gif) no-repeat;right:20px; top:-25px;} #formBox h2 {font-size:24px; margin-bottom:10px;} #formBox form .formContainer {float:left; width:267px;} #formBox form .alt {padding-right:25px;} #formBox form label {font-size:14px; margin:20px 1px 5px;float:left; width:auto;} .formContainer input, .formContainer select, #formBox textarea {border:1px solid #ccc; font-size:14px;float:left; padding:6px 3px 6px 7px; font-family:Arial, Helvetica, sans-serif;} .formContainer input:focus, .formContainer select:focus, #formBox textarea:focus {border:1px solid #000;} #formBox form .formContainer input {width:255px; color:#999;} #formBox form .formContainer input:focus {border-left:5px solid #EB9999;padding:6px 3px 6px 3px; color:#333;} #formBox form .formContainer select {width:267px; padding:6px 3px 6px 7px;} #formBox form textarea {width:548px; height:100px; padding:6px 3px 6px 7px;} #formBox form #sendBtn {width:560px; height:100px; position:relative;} #formBox form button { width:100px; text-align:center; background:#EB9999 url(/images/base/bg-sendBtn.png) center 45px no-repeat; padding:10px 20px 40px;font-size:24px; clear:both; color:#fff; position:absolute; left:235px; bottom:-20px;} #formBox form button:hover {background:#cc0000 url(/images/base/bg-sendBtn.png) center 45px no-repeat; cursor:pointer;} #formBox form button:focus {outline:none;} #page.contact #sidebar {float:right; width:330px;padding:65px 20px 0 0;} #sidebar h3 {font-size:18px;border-bottom:2px dotted #8E7F78;} #sidebar p { padding:20px 0; font-size:14px; line-height:16px;} #sidebar p#phoneNos span {font-size:18px;line-height:24px;} #sidebar p#emails span a {line-height:24px; color:#cc0000;} .validationErrors {padding-top:20px; color:#c00;} #formBox label.error {font-size:12px; color:#cc0000; float:none; font-family:Helvetica, Arial, sans-serif; padding-top:3px;clear:left;display:block;} #successMsg {background:none repeat scroll 0 0 #FFFFFF;border-bottom:2px dashed #B9D2BD;height:659px;left:0;position:absolute;top:20px;width:596px;z-index:1;} #successMsg h4, #successMsg p {padding:20px; text-align:center; font-size:24px;} #successMsg p {background:url(/images/base/bg-message-sent.png) no-repeat center top; padding-top:290px;} /*====================================================================== Blog - SEE wp-content/themes/rbv3/styles.css for rest ======================================================================*/ #article h1, #articlesList h2 {font-family:Rockwell, "Courier New", Courier, Georgia, Times, "Times New Roman", serif;font-weight:normal;} body#blog #titleBarHome {height:220px;} body#blog #titleBarHome .blogHeader {background:url(/images/base/blogHomeBg.gif) right top no-repeat;} body#blog #titleBarHome .blogHeader h1 {font-size:42px;line-height:90px;padding:0 20px;} body#blog #titleBarHome .blogHeader p {width:600px; padding:0 20px 20px; font-size:21px; line-height:32px;} body#blog #titleBar {height:90px;} body#blog #titleBar h2 a {color:#333;text-decoration:none;} body#blog #titleBar h2 span a {color:#F4F7DE;} body#blog #titleBar h2 a:hover {text-decoration:underline;} #articlesList, #article {float:left;} #articlesList {width:640px;} #articlesList div.post {width:600px;float:left; background:#fff; padding:20px; margin:0; margin-top:40px;} #articlesList h2 {font-size:32px;} #articlesList h2 a {color:#333; text-decoration:none;} #articlesList h2 a:hover {color:#cc0000; text-decoration:none;} #articlesList div.excerpt {font-size:16px; line-height:28px; padding:15px 0 0;} #articlesList div.excerpt h2, #articlesList div.excerpt strong {font-size:16px; font-weight:normal; display:inline; font-family: arial, helvetica, sans-serif;} #articlesList div.excerpt a {color:#c00;} #articlesList p.meta {font-size:14px; color:#999; padding-top:32px} body#blog #sidebar {float:right; width:320px;} body#blog #sidebar.alt {float:right; width:180px;} body#blog #sidebar h3 {font-size:24px;border-bottom:2px dotted #8E7F78;margin:60px 0 20px 10px;clear:both;} body#blog #sidebar ul#cats {overflow:hidden;} body#blog #sidebar.alt ul#cats li {float:right;width:180px;clear:both;} ul#cats li {width:auto; float:left; margin:0 0 10px 10px;*margin:0 0 10px 5px;} ul#cats li a, .navigation a, .read-more a {font-size:18px; color:#FFF; text-decoration:none;background:#EB9999; padding:0 10px;line-height:30px; float:left; width:auto;} ul#cats li a:hover, .navigation a:hover, .read-more a:hover {background-color:#cc0000;} ul#authors li {margin:0 0 10px 10px;} ul#authors li a {color:#333; font-size:16px;} ul#authors li h2 {display:none;} ul#authors .user {clear:both;height:100px;margin-bottom:10px;padding:0;width:310px;} ul#authors .name {font-size:18px; text-align:left;padding-top:5px;} ul#authors .name:hover {color:#c00;} ul#authors span.avatar {float:left; margin-right:10px;border:1px solid #ccc;height:80px; background:#fff; padding:4px;} ul#authors .user span.avatar:hover {border:1px solid #c00;} #sidebar.alt span.avatar, #sidebar.alt span.avatar img {width:50px; height:50px;} #sidebar.alt .name{font-size:14px;} #sidebar.alt .user {width:170px;height:70px;} #sidebar.alt h3 {font-size:21px;} #article {width:740px;float:left; background:#fff; padding:40px 20px; margin:40px 0 0;} #article .date, #article .author-name {color:#ccc; font-size:21px; width:auto; text-align:center} #article .author-name span {background:url(/images/base/bg-by.png) center top no-repeat;display:block;height:42px;margin:-40px 0 15px;text-indent:-9999px;} #article h1, #article .excerpt, #article .content {padding:20px 80px;} #article h1 {border-bottom:2px dotted #999;font-size:42px;margin:20px 80px;padding:0 0 30px;text-align:center;} #article .excerpt {font-size:24px; line-height:36px;margin-top:30px;} #article .content {margin-bottom:60px;color:#555;} #article .content h2, #article .content h3, #article .content h4 {padding:20px 0;} #article .content p {font-size:16px;line-height:24px; margin-top:0;} #article .content p a {color:#c00;} #article .content img {border:1px solid #e6e6e6;padding:9px;} #article .content ul { list-style:outside; padding:20px 15px 5px;} #article .content ul li {font-size:16px;line-height:24px;} #article .author {margin:0 80px 60px; border-top:2px dotted #999;} #article .author p.by {color:#999; font-size:12px;padding:10px 0;} #article .author p.badge {position:relative; top:-22px; display:block; padding:60px 0 20px; background:url(/images/base/borderLogo.png) center top no-repeat;} #article .author h3 {font-size:16px;} #article .author img {border:1px solid #ccc; float:left; margin-right:15px;padding:3px;background:#fff;} #article .author a:hover img {border:1px solid #c00; } #article .author h6 {font-size:12px; color:#cc0000;font-weight:normal;line-height:24px;} .navigation {clear:both; padding:40px 20px 0 10px;} .navigation .alignright {float:right;} .navigation .alignleft {float:left;} #articlesList div.excerpt .read-more a {margin:20px 0 0; float:right; width:auto; color:#fff;}