*{margin:0px;padding:0px;} body{font-size:65%;font-family:Arial,verdana;background:#e7d8b7 url('../img/internal_background.jpg') no-repeat center top;} #cntnr{width:1020px;margin:0px auto 0px auto;position:relative;color:#655836;font-size:1.1em;} /*-----------------------------SHARE LINKS */ #sharelinks{display:block;width:60px;height:32px;} .sltext{display:block;height:22px;width:39px;float:left;padding-top:10px;padding-left:6px;} .newsitem #sharelinks{margin-top:30px;margin-right:22px;} .sl1{float:right;margin-top:-35px;margin-right:10px;z-index:20;position:relative;} .sharelinks2{display:block;width:120px;height:32px;float:right;margin-top:10px;} /* ---------------------------share links */ .home{position:relative;} .home .linkbin a{display:block;width:100%;height:100%;} .home .logo{position:absolute;left:25px;width:280px;height:131px;} .home .smallspaces{position:absolute;left:0px;top:165px;width:338px;height:245px;background:transparent url('../img/photo_sml.png') no-repeat left top;} .home .midsize{position:absolute;left:272px;top:307px;width:334px;height:258px;background:transparent url('../img/photo_med.png') no-repeat left top;} .home .largeareas{position:absolute;left:625px;top:260px;width:334px;height:241px;background:transparent url('../img/photo_lrge.png') no-repeat left top;} .home .commwork{position:absolute;left:668px;top:34px;width:350px;height:262px;background:transparent url('../img/photo_commercial.png') no-repeat left top;} .home .whattext{position:absolute;left:360px;top:158px;width:300px;height:105px;background:transparent url('../img/text_whatlandscape.png') no-repeat left top;} .home .process{cursor:pointer;position:absolute;left:70px;top:446px;width:191px;height:117px;background:transparent url('../img/process.png') no-repeat left top;} .home .process:hover{background-image:url('../img/process-o.png');} .home .makeenquiry{position:absolute;left:571px;top:529px;width:176px;height:95px;background:transparent url('../img/enquire.png') no-repeat left top;} .home .makeenquiry:hover{background-image:url('../img/enquire-o.png');} .home .latestnews{cursor:pointer;position:absolute;left:854px;top:501px;width:140px;height:124px;background:transparent url('../img/latest-news.png') no-repeat left top;} .home .latestnews:hover{background-image:url('../img/latest-news-o.png');} .home .rss{position:absolute;left:948px;top:638px;width:20px;height:20px;background:transparent url('../img/icon_rss.gif') no-repeat left top;} .home .rss:hover{background-image:url('../img/icon_rss-o.gif');} .home .fb{position:absolute;left:973px;top:638px;width:20px;height:20px;background:transparent url('../img/icon_facebook.gif') no-repeat left top;} .home .fb:hover{background-image:url('../img/icon_facebook-o.gif');} .home .ftr{padding:9px 0px 0px 15px;position:absolute;top:636px;left:9px;width:460px;height:27px;background:transparent url('../img/footer_tape.png') no-repeat left top;} .home .ftr a{text-decoration:none;color:#63553B;font-size:.9em;} .generic .ftr{clear:both;position:relative;} .generic .hdr{height:95px;margin-bottom:25px;} .generic .logo{float:left;left:25px;width:162px;height:77px;margin:16px 0px 0px 19px;} .generic .mnav{float:left;margin:25px 0px 0px 11px;} .generic .mnav ul li{float:left;list-style-type:none;position:relative;} .generic .mnav ul li a{display:block;width:100%;height:100%;} .generic .mnav ul li.nav1{width:58px;height:70px;} .generic .mnav ul li.nav1 a{background:transparent url('../img/internal/nav-home.gif') no-repeat left top;} .generic .mnav ul li.nav1 a:hover{background-image:url('../img/internal/nav-home-o.gif')} .generic .mnav ul li.nav2{width:60px;height:47px;} .generic .mnav ul li.nav2 a{background:transparent url('../img/internal/nav-about.gif') no-repeat left top;} .generic .mnav ul li.nav2 a:hover{background-image:url('../img/internal/nav-about-o.gif')} .generic .mnav ul li.nav3{width:97px;height:47px;} .generic .mnav ul li.nav3 a{background:transparent url('../img/internal/nav-landscapes.gif') no-repeat left top;} .generic .mnav ul li.nav3 a:hover{background-image:url('../img/internal/nav-landscapes-o.gif')} .generic .mnav ul li.nav4{width:95px;height:47px;} .generic .mnav ul li.nav4 a{background:transparent url('../img/internal/nav-process.gif') no-repeat left top;} .generic .mnav ul li.nav4 a:hover{background-image:url('../img/internal/nav-process-o.gif')} .generic .mnav ul li.nav5{width:125px;height:47px;} .generic .mnav ul li.nav5 a{background:transparent url('../img/internal/nav-awards.gif') no-repeat left top;} .generic .mnav ul li.nav5 a:hover{background-image:url('../img/internal/nav-awards-o.gif')} .generic .mnav ul li.nav6{width:62px;height:47px;} .generic .mnav ul li.nav6 a{background:transparent url('../img/internal/nav-news.gif') no-repeat left top;} .generic .mnav ul li.nav6 a:hover{background-image:url('../img/internal/nav-news-o.gif')} .generic .mnav ul li.nav7{width:77px;height:47px;} .generic .mnav ul li.nav7 a{background:transparent url('../img/internal/nav-enquire.gif') no-repeat left top;} .generic .mnav ul li.nav7 a:hover{background-image:url('../img/internal/nav-enquire-o.gif')} .generic .mnav ul li.nav8{width:61px;height:47px;} .generic .mnav ul li.nav8 a{background:transparent url('../img/internal/nav-blog.gif') no-repeat left top;} .generic .mnav ul li.nav8 a:hover{background-image:url('../img/internal/nav-blog-o.gif')} .generic .ftr1{clear:both;margin-top:20px;padding:12px 0px 0px 15px;width:450px;position:relative;height:26px;background:transparent url('../img/footer_tape.png') no-repeat left top;} .generic .ftr a{text-decoration:none;color:#63553B;font-size:.9em;} .generic .ftr a.dis{color:#A49379;} #rss{width:20px;height:20px;display:block;top:9px;position:absolute;left:407px;} #fb{width:20px;height:20px;display:block;left:428px;top:9px;position:absolute;} .hme #rss{width:20px;height:20px;display:block;top:9px;position:absolute;left:947px;} .hme #fb{width:20px;height:20px;display:block;left:968px;top:9px;position:absolute;} #cntnr .generic .mnav ul li ul{position:absolute;left:-1100000px;top:10px;} #cntnr .generic .mnav ul li:hover ul{left:-10px;top:47px;} #cntnr .generic .mnav ul li ul li.ourp a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-philosophy.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.ourt a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-team.png') no-repeat left top;} a{color:#655836;} /* landscapes sub nav #cntnr .generic .mnav ul li ul li.oure a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-environment.png') no-repeat left top;} */ .awardsmediaovflw{height: 321px; overflow: hidden;} #cntnr .generic .mnav ul li ul{position:absolute;left:-100000px;top:10px;z-index:10000;} #cntnr .generic .mnav ul li:hover ul, #cntnr .generic .mnav ul li.over ul{left:-10px;top:47px;} #cntnr .generic .mnav ul li ul li.sml a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-smllscapes.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.mid a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-midlscapes.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.lrg a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-lrglscapes.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.com a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-comlscapes.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.uf a{display:block;width:110px;height:33px;background:transparent url('../img/internal/nav-unqlscapes.png') no-repeat left top;} #cntnr .generic .mnav ul li ul li.hb a{display:block;width:110px;height:33px;background:transparent url('../img/internal/mifgs.png') no-repeat left top;} .didyouknow{width:382px;height:105px;background:transparent url('../img/internal/didyouknowbg.png') no-repeat left top;position:absolute;left:640px;top:-60px;} .didyouknowI{width:265px;height:81px;margin:15px 0px 0px 105px;overflow:hidden;} .tooltip{cursor:pointer;} #tooltip { position: absolute; z-index: 3000; border: 1px solid #111; background-color: #eee; padding: 5px; opacity: 0.85; } #tooltip h3, #tooltip div { margin: 0; } h1{font-size:160%;} h2{font-size:140%} h3{font-size:120%;} h4{font-size:100%;} .col2 ul{margin-left:15px} .col2 ul li{padding-left:15px;} .generic .ftr2{width:387px;background:red;float:right;height:106px;} .ft2copy{width:260px;height:56px;background:green;margin:37px 0px 0px 106px;} .main{width:580px;float:left;} .enquiryform{width:370px;float:left;color:#655836;} .enquiryform p{padding:10px 0px;} .enquiryformI{padding-left:25px;} #form1 input{margin:0px 6px 5px 0px;width:152px;height:16px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #form1 select{width:152px;height:24px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #form1 textarea{width:259px;height:103px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #aspnetForm input{margin:0px 6px 5px 0px;width:152px;height:16px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #aspnetForm input.imgb{margin:0px;padding:0px;width:47px;height:23px;border:0px;} #aspnetForm select{width:152px;height:24px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #aspnetForm textarea{width:259px;height:103px;background-color:#E9E3C3;border:1px solid #D9CEB0;color:#8B8468;font-size:11px;padding:4px;} #aspnetForm .chkSignup input{width:16px;height:16px;} .mainIntLeft{width:700px;float:left;} .mainIntRight{width:260px;float:left;margin-left:30px;} .mainIntRight p{padding:10px 0px;color:#655836;} .pl5{padding-left:5px;} .cl{clear:both;} img{border:0px;} .fr{float:right;} .fl{float:left;} .dn{display:none;} .scoll-pane{color:#6A5C3F} #innrcntnt1 .col1{width:660px;float:left;} #innrcntnt1 .col2{width:360px;float:left;} #innrcntnt2 .col1{width:360px;float:left;} #innrcntnt2 .col2{width:660px;float:left;} .teammem{width:633px;background-color:#D3C4A7;margin-top:10px;margin-left:5px;} .lnkenquire{display:block;width:201px;height:56px;position:relative;text-indent:-10000px;overflow:hidden;} .lnkenquire span{display:block;width:100%;height:100%;position:absolute;background:transparent url('../img/home/enquire.jpg') no-repeat left top;} .lnkenquire:hover span{background-image:url('../img/home/enquire-o.jpg');} .lnkenquire2{display:block;width:201px;height:56px;position:relative;text-indent:-10000px;overflow:hidden;} .lnkenquire2 span{display:block;width:100%;height:100%;position:absolute;background:transparent url('../img/worktypes/lnkback.png') no-repeat left top;} .lnkenquire3{display:block;width:168px;height:50px;position:relative;text-indent:-10000px;overflow:hidden;} .lnkenquire3 span{display:block;width:100%;height:100%;position:absolute;background:transparent url('../img/worktypes/lnkenquire3.png') no-repeat left top;} .lnkback{display:block;width:86px;height:50px;position:relative;text-indent:-10000px;overflow:hidden;} .lnkback span{display:block;width:100%;height:100%;position:absolute;background:transparent url('../img/worktypes/lnkback.png') no-repeat -10px top;} .newslistingO{width:1005px;} ul.newslist{} ul.newslist li{display:block;float:left;width:495px;height:120px;margin-top:5px;} ul.newslist li.odd{margin-left:15px;} .newslimg{width:167px;height:117px;display:block;float:left;background:transparent url('../img/news/itembg.png') no-repeat left top;} .newslimg a img{display:block;width:143px;height:93px;margin:12px 0px 0px 10px;} .newslc{float:left;width:328px;height:120px;} .newslttl{display:block;height:33px;width:328px;color:#655B49;font-size:1.1em;font-weight:bold;} .newslttl a{display:block;float:left;width:266px;padding-top:12px;text-decoration:none;color:#655B49;} .newslttl a:hover{text-decoration:underline;} .newslttl .pubDate{display:block;float:left;width:62px;font-size:.8em;padding-top:12px;font-weight:normal;} .newslcopy{display:block;width:266px;height:84px;} .newslpgr{margin-top:10px;clear:both;} .newspgrm{float:left;width:245px;text-align:center;padding-top:5px;} .newspgrl{float:left;width:380px;} .newspgrr{float:right;width:380px;text-align:right;} div.newsitem{width:648px;height:435px;background:transparent url('../img/news/itemlrgbg.png') no-repeat left top;padding:17px 0px 0px 18px;} div.newsitem img{display:block;width:609px;height:397px;} #aspnetForm .newslpgr input,#aspnetForm #worktyps input{width:auto;height:auto;padding:0px;margin:0px;} ul.news{margin-left:0px;} ul.news li{display:block;background-color:#D3C4A7;} ul.news li.odd{background-color:transparent;} ul.news li a{color:#655836;display:block;padding:6px 0px 4px 25px;text-decoration:none;background:transparent url('../img/news/news_bullet.png') no-repeat left 4px;} .pdf{font-size:.9em;} .worktypspgr{width:107px;margin-left:152px;} .lsc1{width:415px;float:left;margin-left:52px;} .lsc2{width:320px;float:left;margin-left:10px;padding-top:35px;} .lsc3{width:222px;float:left;text-align:right;} .lsc1 ul li{display:block;float:left;width:203px;height:141px;background:transparent url('../img/landscapes/thumbhldr.png') no-repeat left top;} .lsc1 ul li a img{display:block;margin:15px 0px 0px 14px;width:173px;height:108px;} .worktypelrghldr{width:693px;height:462px;background:transparent url('../img/landscapes/hldrlge.jpg') no-repeat left top;padding:18px 0px 0px 22px;} .worktypelrghldr object{display:block;margin:15px 0px 0px 5px;} .worktypelrghldr img{display:block;width:650px;height:424px;background-color:#ebe5d5;} #aspnetForm .maillist{width:205px;height:96px;position:absolute;top:0px;left:820px;background:transparent url('../img/joinmailingbdy.png') no-repeat left 39px;} #aspnetForm .maillist .ttl{height:39px;background:transparent url('../img/joinmailing.png') no-repeat left top;} #aspnetForm .maillist .fname{width:80px;height:20px;float:left;margin-left:17px;} #aspnetForm .maillist .fname input{width:62px;height:14px;border:1px solid #A5957B;background-color:#CFC1A4;font-size:10px;padding:2px;color:#524630} #aspnetForm .maillist .lname{width:80px;height:20px;float:left;margin-left:4px;} #aspnetForm .maillist .lname input{width:62px;height:14px;border:1px solid #A5957B;background-color:#CFC1A4;font-size:10px;padding:2px;color:#524630} #aspnetForm .maillist .email{width:130px;height:20px;float:left;margin-left:17px;margin-top:6px;} #aspnetForm .maillist .email input{width:124px;height:14px;border:1px solid #A5957B;background-color:#CFC1A4;font-size:10px;padding:2px;color:#524630} #aspnetForm .maillist .submit{width:48px;height:23px;float:left;margin-left:4px;margin-top:6px;overflow:hidden;} #homeO{position:relative;height:400px;} #home-2O{position:absolute;top:-123px;left:244px;width:300px;height:148px;} #home-2{position:relative;width:100%;height:100%;} #home-2 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-2.jpg') no-repeat left top;} #home-3O{position:absolute;top:-123px;left:544px;width:246px;height:148px;} #home-3{position:relative;width:100%;height:100%;} #home-3 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-3.jpg') no-repeat left top;} #home-4O{position:absolute;top:-123px;left:790px;width:240px;height:148px;} #home-4{position:relative;width:100%;height:100%;} #home-4 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-4.jpg') no-repeat left top;} #home-5O{position:absolute;top:25px;left:4px;width:240px;height:97px;} #home-5{position:relative;width:100%;height:100%;} #home-5 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-5.jpg') no-repeat left top;} #home-6O{position:absolute;top:25px;left:244px;width:300px;height:97px;} #home-6{position:relative;width:100%;height:100%;} #home-6 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-6.jpg') no-repeat left top;cursor:pointer;} #home-7O{position:absolute;top:25px;left:544px;width:246px;height:97px;} #home-7{position:relative;width:100%;height:100%;} #home-7 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-7.jpg') no-repeat left top;cursor:pointer;} #home-8O{position:absolute;top:25px;left:790px;width:240px;height:97px;} #home-8{position:relative;width:100%;height:100%;} #home-8 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-8.jpg') no-repeat left top;} #home-9O{position:absolute;top:122px;left:4px;width:240px;height:157px;} #home-9{position:relative;width:100%;height:100%;} #home-9 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-9.jpg') no-repeat left top;cursor:pointer;} #home-10O{position:absolute;top:122px;left:244px;width:546px;height:157px;} #home-10{position:relative;width:100%;height:100%;} #home-10 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-10.jpg') no-repeat left top;} #home-11O{position:absolute;top:122px;left:790px;width:240px;height:157px;} #home-11{position:relative;width:100%;height:100%;} #home-11 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-11.jpg') no-repeat left top;cursor:pointer;} #home-12O{position:absolute;top:254px;left:244px;width:546px;height:192px;} #home-12{position:relative;width:100%;height:100%;} #home-12 span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/home-12.jpg') no-repeat left top;cursor:pointer;} #lnkLatestO{position:absolute;top:314px;left:48px;width:188px;height:130px;} #lnkLatest{position:relative;width:100%;height:100%;} #lnkLatest span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/news.jpg') no-repeat left top;cursor:pointer;} #lnkLatest a:hover span{background:transparent url('../img/home/news-o.jpg') no-repeat left top;} #lnkEnqO{position:absolute;top:322px;left:795px;width:200px;height:73px;} #lnkEnq{position:relative;width:100%;height:100%;} #lnkEnq span{position:absolute;top:0px;left:0px;width:100%;height:100%;background:transparent url('../img/home/enquire.jpg') no-repeat left top;cursor:pointer;} #lnkEnq a:hover span{background:transparent url('../img/home/enquire-o.jpg') no-repeat left top;} /*-----------------------------------------LIGHTBOX */ /** * jQuery lightBox plugin * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/) * and adapted to me for use like a plugin from jQuery. * @name jquery-lightbox-0.5.css * @author Leandro Vieira Pinho - http://leandrovieira.com * @version 0.5 * @date April 11, 2008 * @category jQuery plugin * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com) * @license CC Attribution-No Derivative Works 2.5 Brazil - http://creativecommons.org/licenses/by-nd/2.5/br/deed.en_US * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin */ #jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; } #jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; } #jquery-lightbox a img { border: none; } #lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #lightbox-container-image { padding: 10px; } #lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #lightbox-container-image-box > #lightbox-nav { left: 0; } #lightbox-nav a { outline: none;} #lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; } #lightbox-nav-btnPrev { left: 0; float: left; } #lightbox-nav-btnNext { right: 0; float: right; } #lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; } #lightbox-container-image-data { padding: 0 10px; color: #666; } #lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; } #lightbox-image-details-caption { font-weight: bold; } #lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; } #lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; } /*--------------------------------------------------SCROLLPANE */ .jScrollPaneContainer { position: relative; overflow: hidden; z-index: 1; } .jScrollPaneContainer a{color:#62563C;} .jScrollPaneContainer p{padding:0px 0px 10px 0px;} .jScrollPaneTrack { position: absolute; cursor: pointer; right: 11px; top: 0; width:6px; height: 100%; background: #897C69; } .jScrollPaneDrag { position: absolute; background:transparent url('../img/scrollpane/dragger.jpg') no-repeat left top; width:32px; height:39px; left:-12px; cursor: pointer; overflow: hidden; } .jScrollPaneDragTop { position: absolute; top: 0; left: 0; overflow: hidden; } .jScrollPaneDragBottom { position: absolute; bottom: 0; left: 0; overflow: hidden; } a.jScrollArrowUp { display: block; position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; } a.jScrollArrowUp:hover { /*background-color: #f60;*/ } a.jScrollArrowDown { display: block; position: absolute; z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px; } a.jScrollArrowDown:hover { /*background-color: #f60;*/ } a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover { /*background-color: #f00;*/ } /* Stylesheet for my demo pages for jScrollPane - these styles aren't necessary for using jScrollPane and aren't specific to any particular example */ a.jScrollArrowUp { background: url(../images/basic_arrow_up.gif) repeat-x 0 0; } a.jScrollArrowUp:hover { background-position: 0 -15px; } a.jScrollArrowDown { background: url(../images/basic_arrow_down.gif) repeat-x 0 0; } a.jScrollArrowDown:hover { background-position: 0 -15px; } a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover { background-position: 0 -30px; } .orange-bar .jScrollPaneTrack { background: #f60; } .orange-bar .jScrollPaneDrag { background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%; } .orange-bar .scroll-pane { background: #69f; } .holder { float: left; margin: 10px; } .scroll-pane { width: 100%; height: 100%; overflow: auto; float: left; } .wide { width: 400px; } .super-wide { width: 700px; } .tall { height: 400px; } #pane1 { } #pane2 { height: 150px; } #pane3 { height: 190px; } #pane4 { height: 190px; }