/** * Copyright (c) 2007, Yahoo! Inc. All rights reserved. * Code licensed under the BSD License: * http://developer.yahoo.net/yui/license.txt * version: 2.4.1 * @notes: normalizes fonts and layout across browsers/os. copied over for ginsburg-design.com under BSD License. */ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}legend{color:#000;}body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}table {font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;} body{text-align:center;}#ft{clear:both;}#doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7{margin:auto;text-align:left;width:57.69em;*width:56.301em;min-width:750px;}#doc2{width:73.074em;*width:71.313em;}#doc3{margin:auto 10px;width:auto;}#doc4{width:74.923em;*width:73.117em;}.yui-b{position:relative;}.yui-b{_position:static;}#yui-main .yui-b{position:static;}#yui-main{width:100%;}.yui-t1 #yui-main,.yui-t2 #yui-main,.yui-t3 #yui-main{float:right;margin-left:-25em;}.yui-t4 #yui-main,.yui-t5 #yui-main,.yui-t6 #yui-main{float:left;margin-right:-25em;}.yui-t1 .yui-b{float:left;width:12.3207em;*width:12.0106em;}.yui-t1 #yui-main .yui-b{margin-left:13.3207em;*margin-left:13.0106em;}.yui-t2 .yui-b{float:left;width:13.8456em;*width:13.512em;}.yui-t2 #yui-main .yui-b{margin-left:14.8456em;*margin-left:14.512em;}.yui-t3 .yui-b{float:left;width:23.0759em;*width:22.52em;}.yui-t3 #yui-main .yui-b{margin-left:24.0759em;*margin-left:23.52em;}.yui-t4 .yui-b{float:right;width:13.8456em;*width:13.512em;}.yui-t4 #yui-main .yui-b{margin-right:14.8456em;*margin-right:14.512em;}.yui-t5 .yui-b{float:right;width:18.4608em;*width:18.016em;}.yui-t5 #yui-main .yui-b{margin-right:19.4608em;*margin-right:19.016em;}.yui-t6 .yui-b{float:right;width:23.0759em;*width:22.52em;}.yui-t6 #yui-main .yui-b{margin-right:24.0759em;*margin-right:23.52em;}.yui-t7 #yui-main .yui-b{display:block;margin:0 0 1em 0;}#yui-main .yui-b{float:none;width:auto;}.yui-g .yui-gb .yui-u,.yui-gb .yui-g,.yui-gb .yui-gb,.yui-gb .yui-gc,.yui-gb .yui-gd,.yui-gb .yui-ge,.yui-gb .yui-gf,.yui-gb .yui-u,.yui-gc .yui-u,.yui-gc .yui-g,.yui-gd .yui-u{float:left;margin-left:2%;width:32%;}.yui-gb .yui-gb .yui-u,.yui-gb .yui-gc .yui-u{*margin-left:1.8%;_margin-left:4%;}.yui-g .yui-gb .yui-u{_margin-left:.8%;}.yui-gb .yui-u{float:right;}.yui-gb div.first{margin-left:0;float:left;}.yui-g .yui-gb div.first,.yui-gb .yui-gb div.first{*margin-right:0;*width:32%;_width:31.7%;}.yui-gb .yui-gc div.first,.yui-gb .yui-gd div.first{*margin-right:0;}.yui-gb .yui-gd .yui-u{*width:66%;_width:61.2%;}.yui-gb .yui-gd div.first{*width:31%;_width:29.5%;}.yui-g .yui-gc .yui-u,.yui-gb .yui-gc .yui-u{width:32%;_float:right;margin-right:0;_margin-left:0;}.yui-gb .yui-gc div.first{width:66%;*float:left;*margin-left:0;}.yui-gb .yui-ge .yui-u,.yui-gb .yui-gf .yui-u{margin:0;}.yui-g .yui-u,.yui-g .yui-g,.yui-g .yui-gb,.yui-g .yui-gc,.yui-g .yui-gd,.yui-g .yui-ge,.yui-g .yui-gf,.yui-gc .yui-u,.yui-gd .yui-g,.yui-g .yui-gc .yui-u,.yui-ge .yui-u,.yui-ge .yui-g,.yui-gf .yui-g,.yui-gf .yui-u{float:right;}.yui-g .yui-gc div.first,.yui-g .yui-ge div.first,.yui-g div.first,.yui-gc div.first,.yui-gc div.first div.first,.yui-gd div.first,.yui-ge div.first,.yui-gf div.first{float:left;}.yui-g .yui-g .yui-u,.yui-gb .yui-g .yui-u,.yui-gc .yui-g .yui-u,.yui-gd .yui-g .yui-u,.yui-ge .yui-g .yui-u,.yui-gf .yui-g .yui-u{width:49%;*width:48.1%;*margin-left:0;}.yui-g .yui-g div.first{*margin:0;}.yui-gb .yui-g div.first{*margin-right:4%;_margin-right:1.3%;}.yui-gb .yui-gb .yui-u{_margin-left:.7%;}.yui-gb .yui-g div.first,.yui-gb .yui-gb div.first{*margin-left:0;}.yui-gc .yui-g .yui-u,.yui-gd .yui-g .yui-u{*width:48.1%;*margin-left:0;}.yui-g .yui-u,.yui-g .yui-g,.yui-g .yui-gb,.yui-g .yui-gc,.yui-g .yui-gd,.yui-g .yui-ge,.yui-g .yui-gf{width:49.1%;}.yui-g .yui-gb div.first,.yui-gb div.first,.yui-gc div.first,.yui-gd div.first{margin-left:0;}.yui-g .yui-gc div.first,.yui-gc div.first,.yui-gd .yui-g,.yui-gd .yui-u{width:66%;}.yui-gd div.first,.yui-gb .yui-gd div.first{width:32%;}.yui-g .yui-gd div.first{_width:29.9%;}.yui-ge .yui-u,.yui-ge .yui-g,.yui-gf div.first{width:24%;}.yui-gb .yui-ge div.yui-u,.yui-gb .yui-gf div.yui-u{float:right;}.yui-gb .yui-ge div.first,.yui-gb .yui-gf div.first {float:left;}.yui-ge div.first,.yui-gf .yui-g,.yui-gf .yui-u{width:74.2%;}.yui-gb .yui-ge .yui-u,.yui-gb .yui-gf div.first{*width:24%;_width:20%;}.yui-gb .yui-ge div.first,.yui-gb .yui-gf .yui-u{*width:73.5%;_width:65.5%;}#bd:after,.yui-g:after,.yui-gb:after,.yui-gc:after,.yui-gd:after,.yui-ge:after,.yui-gf:after{content:".";display:block;height:0;clear:both;visibility:hidden;}#bd,.yui-g,.yui-gb,.yui-gc,.yui-gd,.yui-ge,.yui-gf{zoom:1;}.yui-gb .yui-u{float:left;} /** * layout * @notes: styles which control the overall layout of the pages. * also contains some styles for commonly used tags. * this is for page structure. we probably don't need to modify unless redesign. **/ html, body {background:#E2E3E4;color:#636466;} a {color:#79A240;text-decoration:none;} a:hover {text-decoration:underline;} #doc {width:760px;font:normal 85% verdana;} #hd {background-color:#23282C;border-top:10px solid #23282C;position:relative;height:115px;} #bd {border:11px solid #23282C;background-color:#fff;padding:2.5em 0 2em 0;} .shortcontent {height:24.5em;} .content h3 {font-weight:bold;} .content p, .content ul {margin-bottom:1.5em;} .content b {color:#23282C;} #ft {text-align:center;margin:1em 0;font-size:85%;} /** * home page styles * @notes: this is for page structure. we probably don't need to modify unless redesign. */ #doc.home #bd {background:#79A33F;border:11px solid #79A33F;} #doc.home #desc {background:url(/assets/imgs/home/desc.gif) no-repeat;width:390px;height:72px;position:absolute;top:20px;left:350px;} #doc.home #desc span {display:none;} #doc.home .content {position:relative;background:url(/assets/imgs/home/tiles.gif) no-repeat;background-position:15px 0;width:706px;height:365px;} #doc.home .nav-home {display:block;position:absolute;} #doc.home .nav-home span {display:none;} #doc.home #nav-whatwedo {left:140px;} /* created a new graphic reference to whoweare because the background color transparency didn't work well */ #doc.home #nav-whoweare {top:120px;left:335px;background:url(/assets/imgs/home/nav_whoweare_home.gif) no-repeat;width:83px;height:83px;} #doc.home #nav-whoweare:hover {background:url(/assets/imgs/home/nav_whoweare_home_on.gif) no-repeat;} #doc.home #nav-ourwork {top:0;left:535px;} /* created a new graphic reference to contact because the background color transparency didn't work well */ #doc.home #nav-contact {background:url(/assets/imgs/home/nav_contact_home.gif) no-repeat;top:250px;left:595px;} #doc.home #nav-contact:hover {background:url(/assets/imgs/home/nav_contact_home_on.gif) no-repeat;} #doc.home #person {position:absolute;top:310px;left:585px;z-index:100;} /** * top navigation and logo * @notes: styles for the top navigation and logo in the header. * this is for page structure. we probably don't need to modify unless redesign. **/ #hd #logo {position:absolute;top:10px;left:27px;} #hd ul {overflow:auto;} #hd ul li {float:left;} #hd ul span {display:none;} #hd ul a {display:block;position:absolute;} #nav-whatwedo {background:url(/assets/imgs/global/nav_whatwedo.gif) no-repeat;width:101px;height:83px;top:23px;left:379px;} #nav-whoweare {background:url(/assets/imgs/global/nav_whoweare.gif) no-repeat;width:88px;height:87px;left:479px;} #nav-ourwork {background:url(/assets/imgs/global/nav_ourwork.gif) no-repeat;width:84px;height:84px;top:15px;left:579px;} #nav-contact {background:url(/assets/imgs/global/nav_contact.gif) no-repeat;width:98px;height:97px;top:20px;right:-10px;z-index:100;} #nav-whatwedo.on, #nav-whatwedo:hover {background:url(/assets/imgs/global/nav_whatwedo_on.gif) no-repeat;} #nav-whoweare.on, #nav-whoweare:hover {background:url(/assets/imgs/global/nav_whoweare_on.gif) no-repeat;} #nav-ourwork.on, #nav-ourwork:hover {background:url(/assets/imgs/global/nav_ourwork_on.gif) no-repeat;} #nav-contact.on, #nav-contact:hover {background:url(/assets/imgs/global/nav_contact_on.gif) no-repeat;} /** * banner * @notes: common banner styles (the graphic with the dotted top/bottom border). * the contains text-only equivalent of the banner graphic. * this is for page structure. we probably don't need to modify unless redesign. **/ .banner {width:738px;margin:0 0 0;position:relative;} .banner span, .banner h1 {display:none;} .content { padding:25px 8em 0 2em; margin-bottom:5px; background:#fff url(/i/dashes-single.png) repeat-x center top; } /** * what we do (wwd) * @notes: styles specific to 'what we do' section **/ #wwd-banner {background:url(/assets/imgs/whatwedo/banner_weprovide_b.png) no-repeat;height:88px;padding-bottom:15px;} #wwd-process {overflow:hidden;zoom:1;margin:0 0 3em;} #wwd-process li {float:left;background:url(/assets/imgs/whatwedo/connector.gif);padding-right:10px;} #wwd-process li a {display:block;border:2px solid #79A33F;width:102px;height:55px;background-position:8px 8px;background-color:#fff;} #wwd-process li a:hover {border:2px solid #FFD200;} #wwd-process li a span {display:none;} #wwd-research {background:url(/assets/imgs/whatwedo/research.gif) no-repeat;} #wwd-concept {background:url(/assets/imgs/whatwedo/concept.gif) no-repeat;} #wwd-design {background:url(/assets/imgs/whatwedo/design.gif) no-repeat;} #wwd-documentation {background:url(/assets/imgs/whatwedo/documentation.gif) no-repeat;} #wwd-process li.last {padding-right:0;} #wwd-process-order {margin-left:25px;} .wwd-hdr {display:block;height:20px;margin:0 0 .5em -25px;} .wwd-hdr span {display:none;} #wwd-research-hdr {background:url(/assets/imgs/whatwedo/h_research.gif) no-repeat;} #wwd-concept-hdr {background:url(/assets/imgs/whatwedo/h_concept.gif) no-repeat;} #wwd-design-hdr {background:url(/assets/imgs/whatwedo/h_design.gif) no-repeat;} #wwd-documentation-hdr {background:url(/assets/imgs/whatwedo/h_documentation.gif) no-repeat;} /** * our work (ow) * @notes: styles specific to 'our work' section * this is for page structure. we probably don't need to modify unless redesign. **/ #ow-banner {background:url(/assets/imgs/ourwork/banner_hasworked_b.png) no-repeat;height:116px;padding-bottom:15px;} #ow-list li {overflow:hidden;zoom:1;margin-bottom:2em;} #ow-list img {float:left;width:140px;margin:0 18px 0 0;} #ow-list div {float:left;width:440px;} #ow-list .ow-viewcase {display:block;background:url(/assets/imgs/ourwork/btn_viewcase.gif) no-repeat;width:108px;height:11px;margin:.5em 0 0;} #ow-list .ow-viewcase span {display:none;} #ow-checkback {text-align:right;} /* case study styles which are shared among all case study pages */ #ow-backto {display:block;position:absolute;top:20px;right:40px;background:url(/assets/imgs/ourwork/btn_arrow.gif) no-repeat;background-position:0 3px;padding:0 0 1em 30px;color:#6D6E70;} #ow-casestudy {padding-left:37px;padding-right:2em;} #ow-casestudy blockquote {float:right;position:relative;left:8px;} #ow-casestudy blockquote span {display:none;} #ow-casestudy-content {float:left;width:525px;} #ow-enlargenote {font-size:92%;color:#808284;} #ow-casestudy-screens {overflow:hidden;zoom:1;margin:1em 0 2.9em;} #ow-casestudy-screens li {float:left;width:128px;color:#79A240;font:normal 92% verdana;margin-right:6px;} #ow-casestudy-screens li a {display:block;margin:0 0 .5em;border:2px solid #fff;} #ow-casestudy-screens li a:hover {border:2px solid #FFD200;} #ow-casestudy dl {margin:0 0 1.5em;} #ow-casestudy dt {display:inline;color:#000;font-weight:bold;} #ow-casestudy dd {display:inline;} #ow-contact {font-weight:bold;color:#999;} #ow-contact a {display:block;} /** * @notes: this is where we can place styles for building new pages. * eg...new banner/headers, quotes, etc... **/ /* contact page */ #contact {background:url(/assets/imgs/contact/contact_banner.gif) no-repeat;height:72px;} /* who we are */ #whoweare {background:url(/assets/imgs/whoweare/whoweare_banner_b.png) no-repeat;height:52px;} /* case study styles specific to holocaust project */ #ow-holocaust {background:url(/assets/imgs/ourwork/holocaust_banner.gif) no-repeat;height:56px;} #ow-holocaust-quote {background:url(/assets/imgs/ourwork/holocaust_quote.gif) no-repeat;width:143px;height:142px;} #ow-holocaust.ow-nocase {background-position:-130px -1px;height:54px;margin:0 0 .5em 13px;} /* for popup window banner, reuse ow-holocaust background image and use css to cut-off 'Case Study' text */ /* case study styles specific to usable project */ #ow-usable {background:url(/assets/imgs/ourwork/usable_banner.gif) no-repeat;height:56px;} #ow-usable.ow-nocase {background-position:-130px -1px;height:54px;margin:0 0 .5em 13px;} /* for popup window banner, reuse ow-usable background image and use css to cut-off 'Case Study' text */ /* case study styles specific to photos project */ #ow-photos {background:url(/assets/imgs/ourwork/photos_banner.gif) no-repeat;height:56px;} #ow-photos.ow-nocase {background-position:-130px -1px;height:54px;margin:0 0 .5em 13px;} /* for popup window banner, reuse ow-photos background image and use css to cut-off 'Case Study' text */ /* Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html version: 2.8.1 */ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;} /* Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html version: 2.8.1 */ body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;} /* Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html version: 3.2.0 build: 2676 */ .yui3-g{letter-spacing:-0.31em;*letter-spacing:normal;word-spacing:-0.43em;}.yui3-u,.yui3-u-1,.yui3-u-1-2,.yui3-u-1-3,.yui3-u-2-3,.yui3-u-1-4,.yui3-u-3-4,.yui3-u-1-5,.yui3-u-2-5,.yui3-u-3-5,.yui3-u-4-5,.yui3-u-1-6,.yui3-u-5-6,.yui3-u-1-8,.yui3-u-3-8,.yui3-u-5-8,.yui3-u-7-8,.yui3-u-1-12,.yui3-u-5-12,.yui3-u-7-12,.yui3-u-11-12,.yui3-u-1-24,.yui3-u-5-24,.yui3-u-7-24,.yui3-u-11-24,.yui3-u-13-24,.yui3-u-17-24,.yui3-u-19-24,.yui3-u-23-24{display:inline-block;zoom:1;*display:inline;letter-spacing:normal;word-spacing:normal;vertical-align:top;}.yui3-u-1{display:block;}.yui3-u-1-2{width:50%;}.yui3-u-1-3{width:33.33333%;}.yui3-u-2-3{width:66.66666%;}.yui3-u-1-4{width:25%;}.yui3-u-3-4{width:75%;}.yui3-u-1-5{width:20%;}.yui3-u-2-5{width:40%;}.yui3-u-3-5{width:60%;}.yui3-u-4-5{width:80%;}.yui3-u-1-6{width:16.656%;}.yui3-u-5-6{width:83.33%;}.yui3-u-1-8{width:12.5%;}.yui3-u-3-8{width:37.5%;}.yui3-u-5-8{width:62.5%;}.yui3-u-7-8{width:87.5%;}.yui3-u-1-12{width:8.3333%;}.yui3-u-5-12{width:41.6666%;}.yui3-u-7-12{width:58.3333%;}.yui3-u-11-12{width:91.6666%;}.yui3-u-1-24{width:4.1666%;}.yui3-u-5-24{width:20.8333%;}.yui3-u-7-24{width:29.1666%;}.yui3-u-11-24{width:45.8333%;}.yui3-u-13-24{width:54.1666%;}.yui3-u-17-24{width:70.8333%;}.yui3-u-19-24{width:79.1666%;}.yui3-u-23-24{width:95.8333%;} /************************* ************************* PROJECT SPECIFIC CSS ************************** **************************/ /* Canvas */ html,body { background-color:#e9e9e9; } body { text-align:center; margin:0 auto; } * { font-family:verdana; font-size:11px; line-height:1.4; } h1,h2,h3,h4,h5,h6 { font-weight:bold; } h1,h2,h3,h4,h5,h6,p,ul,ol { margin-bottom:1em; } a { text-decoration:none; color:#79A240; } a:hover { text-decoration:underline; } #shell { text-align:left; border-top:9px solid #313b41; border-bottom:9px solid #313b41; width:798px; margin:40px auto 10px auto; } #content { margin:0 20px; border-left:9px solid #313b41; border-right:9px solid #313b41; background-color:#fff; } /* Navigation Tiles */ #nav li { display:block; width:55px; height:55px; float:left; margin-left:5px; } #nav li { background-color:#7aa440; } #nav li:hover { background-color:#b6d887; } #nav li.active, #nav li:hover.active { background:#7aa440 url(/i/nav-notch.png) no-repeat right bottom; } #nav li a { text-decoration:none; display:block; text-indent:-3000px; width:45px; height:55px; color:#fff; font-family:Georgia, Courier, serif; font-size:12px; font-weight:bold; padding:5px; background:transparent url(/i/tilesprite.png) no-repeat left 0px; } #nav li a.what {background-position:left 0;} #nav li a.who {background-position:left -500px;} #nav li a.work {background-position:left -1000px;} #nav li a.contact {background-position:left -1500px;} #nav li a:hover.what {background-position:left -100px;} #nav li a:hover.who {background-position:left -600px;} #nav li a:hover.work {background-position:left -1100px;} #nav li a:hover.contact {background-position:left -1600px;} #nav li.active a.what {background-position:left -200px;} #nav li.active a.who {background-position:left -700px;} #nav li.active a.work {background-position:left -1200px;} #nav li.active a.contact {background-position:left -1700px;} /* Head */ div.head { padding-top:28px; padding-left:20px; padding-right:20px; padding-bottom:24px; background:url(/i/dashes-double.png) repeat-x center bottom; } body.home div.head { /* background:url(/i/dashes-double.png) repeat-x center bottom;*/ } /* Body */ div.home .h_header { margin-bottom:1em; } p.caption { padding-bottom:.5em; border-bottom:1px solid #aeb0b2; } div.body { padding-top:10px; background:url(/i/dashes-single.png) repeat-x center bottom; padding-bottom:13px; /* 10 (default) + 3 (to match height of image) = 13px */ } .col1 { margin-left:20px; width:164px; padding-right:10px; border-right:1px solid #aeb0b2; } .col2 { margin-left:10px; width:330px; padding-right:10px; border-right:1px solid #aeb0b2; } .col3 { margin-left:10px; width:164px; margin-right:20px; } h3 { /* margin-top:1.2em;*/ text-transform:uppercase; color:#7aa440; margin-bottom:.25em; } cite a {color:#636466;} /* Footer */ div.foot p { padding-top:10px; text-align:center; font-family:verdana; font-size:10px; color:#888; padding-bottom:10px; margin-bottom:0; } /* Utilities */ .left { float:left; } .right { float:right; } .clearfix { /* for IE */ zoom:1 } .clearfix:after { /* for Others */ content: "."; display: block; height: 0; clear: both; visibility: hidden; } .pg-what .yui3-u #wwd-process, .pg-what .yui3-u #wwd-process-order{ padding:0 0px; } .pg-contact .content { background-image:none; padding:10px 20px 20px 20px !important;}