/*===================================================================== * * Filename: layout.css * Website: www.gaga.com.au. * Author: Steven Watts - Paste * Date Created: 18/11/2009 * Media: Screen * * Description * ----------- * Layout Style Sheet * *=====================================================================*/ /* Layout styles index -> CSS reset default styles typography containers navigation subnav footer scroll panels forms widgets pagination rollover animated thumbs addthis */ /* =css reset --------------------- */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; list-style-type:none; } /* =default styles ----------------- */ body { height:100%; width:100%; padding:0; background-color:#477a54; } img.bg { width: 100%; position: absolute; top: 0; left: 0; z-index: 5; position:fixed; } div#pointer { position:absolute; width:47px; height:28px; background:url('../images/pointer.png') 0 0 no-repeat; z-index:10000; left:225px; } .breakout { overflow:hidden; background-color:#f3f3ec; padding:14px 14px 20px 14px; } /* =typography ----------------- */ body { font-family:'trebuchet MS', trebuchet, arial, 'lucida console', sans-serif; color:#212121; } div#mainContent h1 { text-transform:uppercase; font-size:24px; margin:0 0 6px 0; color:#212121; line-height:0.9; padding:3px 0 3px 0; } div#mainContent h2 { text-transform:uppercase; font-size:16px; margin:0 0 6px 0; color:#212121; line-height:1; padding:3px 0 3px 0;} div#mainContent h3 {text-transform:uppercase; font-size:16px; margin:0 0 6px 0; color:#575757; line-height:1; padding:3px 0 3px 0;} div#mainContent h4 {text-transform:uppercase; font-size:14px; margin:0 0 6px 0; color:#212121; line-height:1; padding:3px 0 3px 0;} div#mainContent h5 {text-transform:uppercase; font-size:14px; margin:0 0 6px 0; color:#575757; line-height:1; padding:3px 0 3px 0;} div#mainContent p, div#mainContent dl { font-size:11.5px; margin:0 0 12px 0; line-height:1.5; } a { text-decoration:none; } p a { background: url('../images/underline.gif') 0 13px repeat-x; } p a:hover { background: url('../images/underlineUp.gif') 0 13px repeat-x; } .home a { color:#686868; } .home a:hover { color:#b8b8b8; } .pub a { color:#55d9f2;} .pub a:hover { color:#8ce6f7;} .digi a { color:#00b13c;} .digi a:hover { color:#00c944;} .master a { color:#f26f55;} .master a:hover { color:#fca08d;} .pro a { color:#a9365c;} .pro a:hover { color:#d45982;} html body .bgColor a, html body a.bgColor { color:#fff; } html body a.bgColor:hover {color:#fff;} .home .bgColor { background-color:#181816; } .home a.bgColor:hover { background-color:#b8b8b8;; } .pub .bgColor { background-color:#55d9f2;} .pub a.bgColor:hover { background-color:#8ce6f7;} .digi .bgColor { background-color:#00b13c;} .digi a.bgColor:hover { background-color:#00c944;} .master .bgColor { background-color:#f26f55;} .master a.bgColor:hover { background-color:#fca08d;} .pro .bgColor { background-color:#a9365c;} .pro a.bgColor:hover { background-color:#d45982;} .pub input.action { background-color:#55D9F2;} .digi input.action { background-color:#00B13C;} .master input.action { background-color:#F26F55;} /* =containers ----------------- */ div#navCol { float:left; margin:20px 20px 0 54px; position:relative; z-index:30; } div#mainContent { float:left; width:730px; overflow:visible; margin:20px 0 0 0; padding-bottom:50px; position:relative; z-index:30; } div.offset { float:left; position:relative; top:6px; left:6px; border-bottom:6px solid #fff; border-right:6px solid #fff; z-index:40; } /* =navigation ----------------- */ ul#networkNav { float:left; position:relative; top:0; right:0; width:100%; padding:0; margin:0; background-color:#181816; color:#fff; font-size:12px; text-transform:uppercase; z-index:100; } ul#networkNav li:hover { background-color:#484843; } ul#networkNav li a { color:#fff; } ul#networkNav li.current a, ul#networkNav li.section a { color:#afafa6; } ul#networkNav li.top { float:left; padding:0 9px 0 6px; height:31px; } ul#networkNav li.top a { display:block; padding:8px 0 8px 13px; background: url('../images/sprite.png') 0 -31px no-repeat; } ul#networkNav li.home { margin-left:54px; } ul#networkNav li.nav1 { overflow:hidden; z-index:100; } ul#networkNav li.nav1 a { padding-left:9px; background: url('../images/sprite.png') 0 0 no-repeat; } ul#networkNav li.pubNav:hover {background-color:#55d9f2; } ul#networkNav li.digiNav:hover {background-color:#00b13c; } ul#networkNav li.masterNav:hover {background-color:#f26f55; } ul#networkNav li.proNav:hover { background-color:#a9365c; } ul#networkNav li.nav1 ul { position:absolute; top:31px; display:block; height:0; width:140px; margin-left:-6px; overflow:hidden; z-index:60; } ul#networkNav li.nav1 ul li.nav2 { position:relative; z-index:100; height:27px; clear:left; filter:alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; text-align:left; } ul#networkNav li.pubNav ul li.nav2 {background-color:#55d9f2; border-bottom:1px solid #2bbeda; } ul#networkNav li.digiNav ul li.nav2 {background-color:#00b13c; border-bottom:1px solid #00872e; } ul#networkNav li.masterNav ul li.nav2 {background-color:#f26f55; border-bottom:1px solid #e55438; } ul#networkNav li.nav1 ul li.nav2 a { display:block; width:130px; height:20px; padding:8px 4px 0 8px; background-image:none; text-indent:0; color:#fff; font-size:11px; text-decoration:none;} ul#networkNav li.pubNav ul li.nav2 a:hover {background-color:#2bbeda;} ul#networkNav li.digiNav ul li.nav2 a:hover {background-color:#00872e;} ul#networkNav li.masterNav ul li.nav2 a:hover {background-color:#e55438;} ul#networkNav li.newsletter { float:right; } /* =subnav ----------------- */ div#navCol h1 { width:198px; height:167px; display:block;} div#navCol h1 a { width:198px; height:167px; display:block; text-indent:-9999px; background: url('../images/navHome.png') -2px 0 no-repeat; } body.pub div#navCol h1 a { width:198px; height:167px; display:block; text-indent:-9999px; background: url('../images/navPub.png') -2px 0 no-repeat; } body.digi div#navCol h1 a { width:198px; height:167px; display:block; text-indent:-9999px; background: url('../images/navDigi.png') -2px 0 no-repeat; } body.master div#navCol h1 a { width:198px; height:167px; display:block; text-indent:-9999px; background: url('../images/navMaster.png') -2px 0 no-repeat; } body.pro div#navCol h1 a { width:198px; height:167px; display:block; text-indent:-9999px; background: url('../images/navPro.png') -2px 0 no-repeat; } div#navCol h1 a:hover { background-position: -256px 0; } div#navCol ul {padding-top:30px;} div#navCol ul li { width:198px; display:block; margin-bottom:10px; } div#navCol ul li a {width:198px; display:block; text-indent:-9999px; } body.pub div#navCol ul li a {width:198px; display:block; text-indent:-9999px; background-image: url('../images/navPub.png'); } body.digi div#navCol ul li a {width:198px; display:block; text-indent:-9999px; background-image: url('../images/navDigi.png'); } body.master div#navCol ul li a {width:198px; display:block; text-indent:-9999px; background-image: url('../images/navMaster.png'); } div#navCol ul li.subnavnews a { height:46px; background-position:0 -196px; } div#navCol ul li.subnavnews a:hover { height:46px; background-position:-254px -196px; } div#navCol ul li.subnavnews a.current, div#navCol ul li.subnavnews a.section { height:46px; background-position:-475px -196px; } div#navCol ul li.subnavcatalogue a {height:25px; background-position:0 -250px;} div#navCol ul li.subnavcatalogue a:hover {height:25px; background-position:-254px -250px;} div#navCol ul li.subnavcatalogue a.current, div#navCol ul li.subnavcatalogue a.section {height:25px; background-position:-475px -250px;} div#navCol ul li.subnavwhat-we-do a {height:21px; background-position:0 -282px;} div#navCol ul li.subnavwhat-we-do a:hover {height:21px; background-position:-254px -282px;} div#navCol ul li.subnavwhat-we-do a.current, div#navCol ul li.subnavwhat-we-do a.section {height:21px; background-position:-475px -282px;} /* =footer ----------------- */ p.footer {display:block; position:fixed; bottom:0; right:0; width:100%; padding:2px 20px 2px 0; margin:0; color:#fff; font-size:11px; text-align:right; z-index:100; } p.footer a { color:#fff!important; text-decoration:none; background: url('../images/underline.gif') 0 13px repeat-x; } p.footer a:hover { background: url('../images/underlineUp.gif') 0 13px repeat-x; } /* =scroll panels ----------------- */ .jScrollPaneContainer { position: relative; overflow: hidden; z-index: 45; } .jScrollPaneTrack { position: absolute; cursor: pointer; right: 5px; top: 0; height: 100%; width:19px!important; background: url('../images/vtrack.gif') 0 0 repeat-y; z-index: 200;} body.pub .jScrollPaneDrag { position: absolute; background: #666; cursor: pointer; overflow: hidden; width:19px!important; background: url('../images/vtrackBarPub.gif') 0 0 repeat-y; } body.digi .jScrollPaneDrag { position: absolute; background: #666; cursor: pointer; overflow: hidden; width:19px!important; background: url('../images/vtrackBarDigi.gif') 0 0 repeat-y; } body.master .jScrollPaneDrag { position: absolute; background: #666; cursor: pointer; overflow: hidden; width:19px!important; background: url('../images/vtrackBarMaster.gif') 0 0 repeat-y; } body.pub .jScrollPaneDrag:hover { background: url('../images/vtrackBarPub.gif') -19px 0 repeat-y; } body.digi .jScrollPaneDrag:hover { background: url('../images/vtrackBarDigi.gif') -19px 0 repeat-y; } body.master .jScrollPaneDrag:hover { background: url('../images/vtrackBarMaster.gif') -19px 0 repeat-y; } .jScrollPaneDragTop { position: absolute; top: 0; left: 0; overflow: hidden; width:19px!important; } .jScrollPaneDragBottom { position: absolute; bottom: 0; left: 0; overflow: hidden; width:19px!important; } a.jScrollArrowUp { display: block; position: absolute; z-index: 100; top: 0; right: -1px; text-indent: -2000px; overflow: hidden; width: 19px; height: 7px; background: url('../images/vtrackArrowUp.gif') 0 0 repeat-y; } a.jScrollArrowUp:hover { } a.jScrollArrowDown { display: block; position: absolute; z-index: 100; bottom: 0; right: -1px; text-indent: -2000px; overflow: hidden; width: 19px; height: 7px; background: url('../images/vtrackArrowDown.gif') 0 0 repeat-y; } a.jScrollArrowDown:hover { } a.jScrollcurrentArrowButton, a.jScrollcurrentArrowButton:hover { } /* =forms ----------------- */ label { padding:10px 0 4px 0; color:#212121; font-weight:normal; font-size:11.5px;} textarea, input { font-size:12px; border:0; background-color:#c3cac1; display:block; margin:6px 0 14px 0; padding:6px 9px 6px 9px; color:#212121; font-family:'trebuchet MS', trebuchet, arial, 'lucida console', sans-serif; } input.action { text-align:left; text-transform:uppercase; padding:2px 6px 2px 6px; color:#fff; font-weight:normal; font-size:14px; float:left; cursor:pointer; background-color:#e0d1c2; } input.hidden { display:none;} textarea { height:110px; } /* =widgets ----------------- */ div#widgetCol { float:left; width:247px; margin-left:25px; } div#widgetCol div.soundCloudOffset { padding:0; width:234px; height:144px; top:0; margin:6px 0 19px 0;} div#widgetCol div.soundCloud { position:relative; top:-6px; left:-6px; z-index:45;} div#widgetCol div.vimeoPanel {margin-bottom:25px;} div#widgetCol div.vimeoOffset { padding:0; width:234px; height:154px; top:0; margin:6px 0 19px 0;} div#widgetCol div.vimeo { position:relative; top:-6px; left:-6px; float:left; z-index:45; } div#widgetCol a.twitterLink { float:left; height:54px; margin-bottom:25px; } div#widgetCol div.recentPostsPanel { float:left; width:241px; height:520px; overflow:visible; background:transparent url('../images/blueTransBG.png') 0 0 repeat; } div#widgetCol div.recentPostsOffset { width:220px; height:514px; padding-right:14px; position:relative; z-index:30; overflow:hidden;/* Overflow hidden for scroll*/ } div#widgetCol div.recentPostsPanel #vpane { position:relative; display:block; width:224px; height:404px; padding:0 0 0 8px; overflow:auto; z-index:45; }/* JSCROLL PANE*/ div#widgetCol div.recentPostsPanel h2 { font-size:20px; padding:14px 8px 8px 8px; } div#widgetCol div.recentPostsPanel ul { } div#widgetCol div.recentPostsPanel ul li { float:left; } div#widgetCol div.recentPostsPanel ul li h2 { padding:0; } div#widgetCol div.recentPostsPanel ul li h2 a { padding:2px 6px 2px 6px; color:#fff; font-weight:normal; font-size:14px; float:left; } div#widgetCol div.recentPostsPanel ul li p { clear:left; padding:6px 3px 0 6px; font-size:11px; line-height:15px; } div#widgetCol div.recentPostsPanel h3.more a { text-transform:uppercase; padding:2px 6px 2px 6px; margin: 14px 0 0 8px; color:#fff; font-weight:normal; font-size:14px; float:left; background-color:#c9c0b7; } div#widgetCol div.recentPostsPanel h3.more a:hover { background-color:#e0d1c2;} div#widgetCol div.loginPanel { float:left; width:241px; overflow:visible; margin-bottom:25px; background:transparent url('../images/transPNGBG.png') 0 0 repeat; } div#widgetCol div.loginOffset { width:220px; padding-right:14px; position:relative; padding-bottom:15px; z-index:30; } div#widgetCol div.loginOffset h2 { font-size:20px; padding:14px 8px 8px 0; margin:0 0 8px 8px; border-bottom:3px solid #fff; } div#widgetCol div.loginPanel div.loginOffset form { display:block; padding:0 0 14px 8px; } div#widgetCol div.loginPanel div.loginOffset div.inputs {overflow:hidden; padding:6px 0 6px 0; } div#widgetCol div.loginPanel div.loginOffset div.inputs label { float:left; clear:left; width:55px; padding:3px 14px 0 0; margin:0 0 11px 0; } div#widgetCol div.loginPanel div.loginOffset div.inputs input.text, div#widgetCol div.loginPanel div.loginOffset div.inputs input.fields { float:left; clear:none; width:131px; padding:3px 6px 3px 6px; margin:0 0 0 0;} div#widgetCol div.loginPanel div.loginOffset form p {clear:left; float:left; padding:4px 0 0 0; margin:0;} div#widgetCol div.loginPanel div.loginOffset form #Remember{display:none;} div#widgetCol div.loginPanel div.loginOffset form #Remember input { float:left; margin-right:6px; width:15px; } div#widgetCol div.loginPanel div.loginOffset form #Remember label { float:left; padding-top:4px; width:70px; } div#widgetCol div.loginPanel div.loginOffset form .action { clear:left; float:right; margin:-4px 0 0 0; padding:3px 9px; color:#fff; text-transform:uppercase; } div#widgetCol div.loginPanel div.loginOffset p { margin:0 0 8px 8px; } p#Remember {display:none;} p#ForgotPassword { float:right; padding:6px 0 0;} a.logoutlink { float:left; clear:left; font-size:14px; line-height:12px; padding:6px 9px; margin-top:8px; background-image:none; text-transform:uppercase; } a.logoutlink:hover { background-image:none; } /* =pagination ----------------- */ p.pagination { float:left; clear:left; padding:20px 0 20px 0; } p.pagination span { background-color:#626262; } p.pagination span, p.pagination a { float:left; color:#fff; height:14px; text-align:center; padding:3px 6px 3px 6px; margin-left:3px; font-size:14px; line-height:14px; background-image:none; } p.pagination a span.leftArrow { background-color:transparent; } p.pagination a span.rightArrow { background-color:transparent; } p.pagination a span { display:inline!important; float:none; padding:0; margin:0; } /* =rollover animated thumbs --------------------- */ div.whatWeDoIndexOffset ul.placementsList { float:left; } ul.placementsList li { position:relative; float:left; width:203px; height:191px; background-color:#c9c0b7; z-index:80; } ul.placementsList li a.image { position:absolute; float:left; width:203px; height:158px; z-index:100; } ul.placementsList li a.image img { float:left; } ul.placementsList li h2 { position:absolute; float:left; width:203px; height:191px; padding:0!important; z-index:150; } ul.placementsList li h2 a { float:left; width:203px; height:191px; cursor:pointer; } body.pub ul.placementsList li h2 a { background-image: url('../images/thumbRollUp-Pub.gif');} body.digi ul.placementsList li h2 a { background-image: url('../images/thumbRollUp-Digi.gif');} body.master ul.placementsList li h2 a { background-image: url('../images/thumbRollUp-Master.gif');} body.pub ul.placementsList li h2 a:hover { background-image: url('../images/thumbRollOver-Pub.gif'); } body.digi ul.placementsList li h2 a:hover { background-image: url('../images/thumbRollOver-Digi.gif'); } body.master ul.placementsList li h2 a:hover { background-image: url('../images/thumbRollOver-Master.gif'); } ul.placementsList li h2 a span.animLinkTitle { float:left; height:19px; width:166px; position:relative; top:160px; padding:9px 7px 5px 30px; color:#fff; font-size:14px; font-weight:100; background:transparent url('../images/sprite.png') 6px -96px no-repeat ; z-index:200;} ul.placementsList li a.playVideo { position:absolute; display:block; width:203px; height:158px; text-indent:-9999px; z-index:120; } body.pub ul.placementsList li a.playVideo { background-image: url('../images/playPub.png'); } body.digi ul.placementsList li a.playVideo { background-image: url('../images/playDigi.png'); } body.master ul.placementsList li a.playVideo { background-image: url('../images/playMaster.png'); } ul.placementsList li a.playVideo:hover { background-position: 0 -158px;} /* =addthis --------------------- */ /* a.addthis_button { position:relative; clear:left; float:left; text-transform:uppercase; padding:2px 6px 2px 6px; margin:0; color:#fff!important; font-weight:normal; font-size:14px; line-height:1; } */ div.addthis_toolbox {clear:left; } /*=====================================================================*/ /* Page styles index -> home subdomains news news articles what we do index what we do item catalogue index catalogue item production login contact newsletter signup */ /* =home ----------------- */ body.home div#pointer { top:127px; } div#heroPanel { float:left; width:719px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div.heroPanelOffset { padding:8px 8px 14px 8px; } #homeSlideshow { float:left; position:relative; top:0; left:0; width:463px; height:285px; background-color:#ebebeb; z-index:30; } div#homeIntroduction { float:left; width:215px; margin:0 0 0 14px; } div#homeIntroduction h1 { border-bottom:3px solid #ced2cc; width:209px; padding-bottom:16px; margin:0; } div#homeIntroduction p { width:209px; padding-top:16px;} ul#pushLinks { padding-top:7px;} ul#pushLinks li { display:block; width:209px; height:30px; margin:0; padding:0; } ul#pushLinks li a { display:block; width:159px; height:14px; background: url('../images/sprite.png') 10px -64px no-repeat; padding:7px 17px 9px 33px; margin:0; font-size:14px; color:#fff; text-transform:uppercase; cursor:pointer; } ul#pushLinks li.pub a { background-color:#474747; } ul#pushLinks li.pub a:hover { background-color:#55d9f2; } ul#pushLinks li.digi a { background-color:#3e3e3e; } ul#pushLinks li.digi a:hover { background-color:#00b13c; } ul#pushLinks li.master a { background-color:#353535; } ul#pushLinks li.master a:hover { background-color:#f26f55; } ul#pushLinks li.pro a { background-color:#282828; } ul#pushLinks li.pro a:hover { background-color:#a9365c; } body.home div#widgetCol { position:relative; clear:left; float:left; width:231px; padding:25px 0 50px 0; margin-left:0; z-index:20; } body.home div#widgetCol div.soundCloudPanel { float:left; width:208px; height:170px; background-color:#a1a1a1; margin-bottom:0; z-index:30; overflow:visible; } body.home div#widgetCol div.soundCloudOffset { padding:0; width:219px; height:270px; top:0;} body.home div#widgetCol div.soundCloud { position:relative; top:-6px; left:-6px; z-index:45;} body.home div#widgetCol div.vimeoPanel { float:left; width:225px; height:256px; background-color:#a1a1a1; z-index:30; overflow:visible; } body.home div#widgetCol div.vimeoPanel:hover { background-color:#b8b8b8; } body.home div#widgetCol div.vimeoOffset { float:left; padding:0; width:219px; height:250px; top:0; } body.home div#widgetCol div.vimeo { position:relative; float:left; top:-6px; left:-6px; z-index:45; } body.home div#widgetCol div.vimeoOffset h2 { float:left; color:#fff; padding:8px 0 0 8px; margin:0; } body.home div#widgetCol div.vimeoOffset h2 a { } body.home div#widgetCol div.vimeo h2 a:hover { } body.home div#widgetCol p { float:left; clear:left; font-size:11px; line-height:15px; padding:8px 8px 14px 8px; } body.home div#widgetCol a.twitterLink { float:left; width:231px; height:54px; margin-bottom:19px; } body.home div#newsCol { position:relative; float:left; width:464px; padding:25px 0 50px 0; margin-left:19px; z-index:20;} body.home div#newsCol div.newsPanel { float:left; width:464px; background:transparent url('../images/blueTransBG.png') 0 0 repeat; overflow:visible;} body.home div#newsCol div.newsOffset { padding:0; width:458px; top:6px;} body.home div#newsCol div.newsOffset p { clear:left; font-size:11px; line-height:15px; padding:0 5px 2px 5px; margin:0 8px 6px 0; } body.home div#newsCol div.newsOffset p a { color:#686868; background: url('../images/underline.gif') 0 13px repeat-x; } body.home div#newsCol div.newsOffset p a:hover { color:#b8b8b8; background: url('../images/underlineUp.gif') 0 13px repeat-x; } body.home div#newsCol div.newsOffset li.largeRecentNews { float:left; width:210px; height:350px; margin: 8px 0 10px 10px; padding-bottom:10px; border-bottom:3px solid #ced2cc;} body.home div#newsCol div.newsOffset li.largeRecentNews img { padding-bottom:8px; } body.home div#newsCol div.newsOffset li p { display:block; clear:left; } body.home div#newsCol div.newsOffset h2 { float:left; padding:0; margin:0 8px 15px 0; } body.home div#newsCol div.newsOffset h2 a { float:left; clear:left; font-size:14px; padding:2px 6px 2px 6px; background-color:#a1a1a1; color:#fff; } body.home div#newsCol div.newsOffset h2 a:hover { background-color:#b8b8b8;} body.home div#newsCol div.newsOffset .pub h2 a:hover { background-color:#55d9f2;} body.home div#newsCol div.newsOffset .digi h2 a:hover { background-color:#00b13c;} body.home div#newsCol div.newsOffset .master h2 a:hover { background-color:#f26f55;} body.home div#newsCol div.newsOffset .pub p a:hover { color:#55d9f2;} body.home div#newsCol div.newsOffset .digi p a:hover { color:#00b13c;} body.home div#newsCol div.newsOffset .master p a:hover { color:#f26f55;} body.home div#newsCol div.newsOffset li.smallRecentNews { float:left; display:inline-block; width:210px; height:195px; margin: 0 0 10px 10px; padding:8px 0 4px 0; border-bottom:3px solid #ced2cc; } body.home div#newsCol div.newsOffset li.last { border:0!important; } /* body.home div#newsCol div.newsOffset li.smallRecentNews h2 a { margin-left:6px; padding:0; color:#686868; font-size:14px; background: url('../images/underline.gif') 0 17px repeat-x;padding-bottom:5px; } body.home div#newsCol div.newsOffset li.smallRecentNews h2 a:hover { color:#b8b8b8; background: url('../images/underlineUp.gif') 0 17px repeat-x; } */ /* =subdomains ----------------- */ body.digiHome div#pointer, body.pubHome div#pointer, body.masterHome div#pointer, body.proHome div#pointer { top:127px; } div#subdomainPanel { float:left; width:448px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#subdomainPanel div.subdomainPanelOffset { padding:8px 14px 14px 8px; } div#subdomainPanel #subdomainSlideshow { float:left; position:relative; top:0; left:0; width:420px; height:323px; background-color:#ebebeb; z-index:30; } div#subdomainPanel div#subdomainIntroduction { float:left; width:392px; padding:14px; background-color:#ecece6; } div#subdomainPanel ul.placementsList { float:left; padding-top:14px; } div#subdomainPanel ul.placementsList li.item { margin-right:14px; } /* =news ----------------- */ body.news div#pointer { top:262px; } div#newsIndexPanel { float:left; width:530px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#newsIndexPanel div.newsIndexOffset { padding:8px 14px 14px 8px; } div#newsIndexPanel div.newsIndexOffset ul { padding-top:6px; } div#newsIndexPanel div.newsIndexOffset ul li { float:left; padding:20px 0 20px 0; border-bottom:3px solid #d2d2d2; } div#newsIndexPanel div.newsIndexOffset ul li.firstItem {padding-top:0;} div#newsIndexPanel div.newsIndexOffset ul li img { float:left; padding-right:14px; } div#newsIndexPanel div.newsIndexOffset ul li h2 { margin:0 0 14px 0; } div#newsIndexPanel div.newsIndexOffset ul li h2 a { color:#fff; font-size:14px; padding:2px 6px 2px 6px; } div#newsIndexPanel div.newsIndexOffset ul li p.author { margin-bottom:0; } /* =news articles ----------------- */ div#newsArticlePanel { float:left; width:448px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#newsArticlePanel div.newsArticleOffset { padding:8px 14px 14px 8px; width:420px;} div#newsArticlePanel div.newsArticleOffset textarea, div#newsArticlePanel div.newsArticleOffset input { width:398px; } div#newsArticlePanel div.newsArticleOffset input.action { width:140px; } body div#newsArticlePanel div.newsArticleOffset img.newsMainImage { padding-bottom:20px; } body div#newsArticlePanel div.newsArticleOffset h2.author { padding:20px 0; } body div#newsArticlePanel div.newsArticleOffset h2.grey { float:left; width:100%; border-top:3px solid #c3cac1; padding-top:20px; } body div#newsArticlePanel div.newsArticleOffset ul.comments { float:left; width:100%; list-style-type:none; } body div#newsArticlePanel div.newsArticleOffset ul.comments li.commentItem { list-style-type:none; padding:20px 0 20px 0; margin:0; /*border-top:3px solid #d2d2d2;*/ border-top:3px solid #c3cac1; text-indent:0; background-image:none; } body div#newsArticlePanel div.newsArticleOffset ul.comments li.commentItem h3 { padding:0 0 0 26px; background: url('../images/commenter.png') 0 2px no-repeat; } #newsArticlePanel ul {margin:0 0 6px 0; padding:3px 0 10px 0; } #newsArticlePanel ul li { padding-bottom:0.8em; background: url('../images/bullet.gif') 10px 6px no-repeat; text-indent:38px;} #newsArticlePanel ol { margin:0 0 6px 31px; padding:3px 0 10px 0; } #newsArticlePanel ol li { list-style: upper-roman; padding-bottom:0.8em; text-indent:6px; } #newsArticlePanel em {font-style:italic;} #newsArticlePanel blockquote, div#mainContent #newsArticlePanel blockquote p { font-style:italic; line-height:16px; text-transform:none; color:#323232;} div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r1_c1 { background: url('../images/recaptchaSprite.png') -0px -63px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r2_c1 { background: url('../images/recaptchaSprite.png') -18px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r2_c2 { background: url('../images/recaptchaSprite.png') -27px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r3_c1 { background: url('../images/recaptchaSprite.png') -0px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r3_c2 { background: url('../images/recaptchaSprite.png') -18px -57px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r3_c3 { background: url('../images/recaptchaSprite.png') -9px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r4_c1 { background: url('../images/recaptchaSprite.png') -43px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r4_c2 { background: url('../images/recaptchaSprite.png') -36px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r4_c4 { background: url('../images/recaptchaSprite.png') -214px -0px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r7_c1 { background: url('../images/recaptchaSprite.png') -43px -49px no-repeat!important; } div#newsArticlePanel div.newsArticleOffset .recaptchatable .recaptcha_r8_c1 { background: url('../images/recaptchaSprite.png') -43px -49px no-repeat!important; } .recaptcha_theme_red #recaptcha_response_field { border:1px solid #ccd0ca!important; } /* Remove reCaptcha button images */ a#recaptcha_reload_btn { display:block; width:25px; height:17px; background: url('../images/recaptchaSprite.png') -311px 0 no-repeat !important; margin:0!important;} a#recaptcha_switch_audio_btn { display:block; width:25px; height:16px; background: url('../images/recaptchaSprite.png') -318px -49px no-repeat !important; margin:0!important; } a#recaptcha_whatsthis_btn { display:block; width:25px; height:16px; background: url('../images/recaptchaSprite.png') -311px -33px no-repeat !important; margin:0!important; } img#recaptcha_reload, img#recaptcha_switch_audio, img#recaptcha_whatsthis { display:none;} /* =what we do index ----------------- */ body.whatWeDo div#pointer { top:337px; } div#whatWeDoIndexPanel { float:left; width:649px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#whatWeDoIndexPanel div.whatWeDoIndexOffset { padding:8px 8px 0px 6px; } div#whatWeDoIndexPanel div.whatWeDoIndexOffset ul { width:627px; } div#whatWeDoIndexPanel div.whatWeDoIndexOffset ul li { margin:0 3px 6px 3px; } /* =what we do item ----------------- */ div#placementsPanel { float:left; width:250px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#placementsPanel div.placementsOffset { padding:8px 2px 14px 0; position:relative; z-index:30; overflow:hidden;/* Overflow hidden for scroll*/ } div#placementsPanel div.placementsOffset #vpane { position:relative; display:block; width:233px; height:494px; padding:0 0 0 8px; overflow:auto; z-index:45; }/* JSCROLL PANE*/ div#placementsPanel div.placementsOffset li { margin-bottom:14px;} h3.more a { text-transform:uppercase; padding:2px 6px 2px 6px; margin: 14px 0 0 8px; color:#fff; font-weight:normal; font-size:14px; float:left; background-color:#c9c0b7; } h3.more a:hover { background-color:#e0d1c2;} div#whatWeDoItemPanel { float:left; width:420px; background: url('../images/transPNGBG.png') 0 0 repeat; margin-left:25px; z-index:30;} div#whatWeDoItemPanel div.whatWeDoItemOffset { width:414px; padding:0; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.vimeo { position:relative; top:-6px; left:-6px; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails { position:relative; padding:8px 14px 14px 8px; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details { position:relative; overflow:hidden; padding:0 0 2px 0; border-bottom:3px solid #fff; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details h1 { width:300px; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details dl { clear:left; float:left; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details dl dt { clear:left; float:left; width:75px; font-style:italic; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details dl dd { float:left; width:300px; text-transform:uppercase; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.details div.addthis_toolbox { position:absolute; top:3px; right:0; } div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.description {padding-top:14px;} div#whatWeDoItemPanel div.whatWeDoItemOffset div.placementDetails div.description p { clear:left; } /* =catalogue index ----------------- */ body.catalogue div#pointer { top:305px; } div#catalogueIndexPanel { float:left; width:682px; min-height:624px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#catalogueIndexPanel div.catalogueIndexOffset { width:660px; padding:8px 8px 15px 8px; min-height:624px; } ul#catalogueNav { position:absolute; display:block; width:20px; z-index:100; left:7px; top:7px; } ul#catalogueNav li.nav1 { display:block; width:20px; height:20px; margin-bottom:4px; color:#fff; text-transform:uppercase; font-weight:normal; font-size:14px; } ul#catalogueNav li.nav1 a { display:block; position:relative; top:0; width:20px; height:20px; color:#fff; text-align:center; padding-top:1px; background-color:#c9c0b7; z-index:120; } ul#catalogueNav li.nav1.active a { background-color:#626262; } body.pub ul#catalogueNav li.nav1 a:hover, body.pub ul#catalogueNav li.nav1:hover a { background-color:#55d9f2; } body.digi ul#catalogueNav li.nav1 a:hover, body.digi ul#catalogueNav li.nav1:hover a { background-color:#00b13c; } body.master ul#catalogueNav li.nav1 a:hover, body.master ul#catalogueNav li.nav1:hover a { background-color:#f26f55; } ul#catalogueNav li.nav1 ul { position:absolute; top:0; left:20px; float:left; width:0px; min-height:621px; padding:3px 0 0 0; z-index:80; opacity:0.95; overflow:hidden; } body.pub ul#catalogueNav li.nav1 ul { background-color:#55d9f2; } body.digi ul#catalogueNav li.nav1 ul { background-color:#00b13c; } body.master ul#catalogueNav li.nav1 ul { background-color:#f26f55; } ul#catalogueNav li.nav1 ul li.nav2 { width:274px; } ul#catalogueNav li.nav1 ul li.nav2 a { width:100%; background:transparent url('../images/sprite.png') 10px -68px no-repeat; line-height:14px; font-size:14px; height:20px; text-align:left; padding:5px 0 0 34px; cursor:pointer; } body.pub ul#catalogueNav li.nav1 ul li.nav2 a { border-bottom:1px solid #8ce6f7; } body.digi ul#catalogueNav li.nav1 ul li.nav2 a { border-bottom:1px solid #00c944; } body.master ul#catalogueNav li.nav1 ul li.nav2 a { border-bottom:1px solid #fca08d; } body.pub ul#catalogueNav li.nav2 a:hover { background-color:#8ce6f7; } body.digi ul#catalogueNav li.nav2 a:hover { background-color:#00c944; } body.master ul#catalogueNav li.nav2 a:hover { background-color:#fca08d; } div#catalogueIndexPanel div.catalogueIndexOffset ul.placementsList { position:relative; left:30px; float:left; } div#catalogueIndexPanel div.catalogueIndexOffset ul.placementsList li { margin:0 3px 6px 3px; } div#catalogueIndexPanel div.catalogueIndexOffset ul.placementsList li h2 a span.animLinkTitle { background:transparent url('../images/sprite.png') 6px -64px no-repeat; } div#catalogueIndexPanel div.catalogueIndexOffset p.pagination { position:relative; left:30px; } /* =catalogue item ----------------- */ div#catalogueItemPanel { float:left; width:448px; background: url('../images/transPNGBG.png') 0 0 repeat; z-index:30;} div#catalogueItemPanel div.catalogueItemOffset { width:420px; padding:8px 14px 14px 8px; } div.catalogueContentCol { position:relative; left:34px; width:358px; float:left; z-index:80;} div#catalogueItemPanel div.catalogueItemOffset div.catalogueContentCol h1.overlayHeader { position:absolute; top:224px; display:block; padding:14px 22px 14px 22px; color:#fff; font-size:23px; line-height:26px; z-index:100; } body.pub div.catalogueContentCol h1.overlayHeader { background: url('../images/overlayPub.png') 0 0 repeat; } body.digi div.catalogueContentCol h1.overlayHeader { background: url('../images/overlayDigi.png') 0 0 repeat; } body.master div.catalogueContentCol h1.overlayHeader { background: url('../images/overlayMaster.png') 0 0 repeat; } div#catalogueItemPanel div.catalogueItemOffset img.newsMainImage { padding-bottom:20px; } div#catalogueItemPanel div.catalogueItemOffset .breakout { width:100%; } body.catalogue div#widgetCol div.recentPostsPanel { height:350px; } body.catalogue div#widgetCol div.recentPostsOffset { height:324px; padding:20px 14px 0 0; } body.catalogue div#widgetCol div.recentPostsPanel #vpane { height:304px; } /* JSCROLL PANE*/ .breakout ul { margin:0 0 6px 0; padding:3px 0 10px 0; } .breakout ul li { padding-bottom:0.8em; background: url('../images/bullet.gif') 10px 6px no-repeat; text-indent:38px;} .breakout ol { margin:0 0 6px 31px; padding:3px 0 10px 0; } .breakout ol li { list-style: upper-roman; padding-bottom:0.8em; text-indent:6px; } .breakout em {font-style:italic; } .breakout blockquote, .breakout blockquote p { font-style:italic; line-height:16px; text-transform:none; color:#323232;} /* =production ----------------- */ body.proHome div.breakout { margin-bottom:14px; } body.proHome div.soundCloud { padding-bottom:14px; } div.proVimeoWrapper, div.proThirdPartyWrapper { padding-bottom:15px; } .pro .loginPanel .action { background-color:#a9365c;} .pro .loginPanel .action:hover { background-color:#d45982;} /* =login ----------------- */ #MemberLoginForm_LoginForm_action_logout { width:180px!important; } /* =contact ----------------- */ div.soundcloud-dropbox a.soundcloud-dropbox { float:left; margin: 10px auto; background: transparent url('http://a1.soundcloud.com/images/dropbox_small_dark.png?a8f729') top left no-repeat; color: #d9d9d9; font-size: 10px; height: 30px; padding: 26px 60px 0 12px; width: 127px; text-decoration: none; line-height: 1.3em; clear: both; } /* = newsletter signup ----------------- */ #NewsletterSignup { position:absolute; width:100%; height:100%; z-index:2000!important; top:0px; left:0px; opacity:0; display:none; } #NewsletterSignup .overlay { position:fixed; width:100%; height:100%; z-index:2020 !important; top:0px; left:0px; background:#020202; opacity:.95; } #NewsletterSignup .NewsletterContainer { background-color:#dcefed; opacity:1; margin:100px auto; overflow:hidden; padding:15px 15px; position:relative; width:360px; z-index:2030!important;} #NewsletterSignup .NewsletterContainer h2 { text-transform:uppercase; font-size:24px; margin:0 0 6px 0; color:#212121; line-height:0.9; padding:3px 0 3px 0; } #NewsletterSignup .NewsletterContainer p { font-size:11.5px; margin:0 0 12px 0; line-height:1.5; } #NewsletterSignup .NewsletterContainer p#NewsletterSignupClose { text-transform:uppercase; padding:2px 6px 2px 6px; color:#fff; font-weight:normal; font-size:14px; float:right; background-color:#c9c0b7; } #NewsletterSignup .NewsletterContainer label {clear:left; float:left; width:60px; padding-top:4px; margin:10px 0 0 0;} #NewsletterSignup .NewsletterContainer input.name, #NewsletterSignup .NewsletterContainer input.email { float:left; background-color:#c9c0b7; margin:10px 0 0 0; } #NewsletterSignup .NewsletterContainer input.submit { clear:left; float:left; color:#fff; text-transform:uppercase; margin:20px 0 0 0;}