img, div, input { behavior: url("/style/iepngfix.htc"); } .clear { clear:both; } html, body { height:100%; } /* set this to force 100% in IE6*/ body { margin:0; padding:0; text-align:center; min-width:900px; background-color:#FFF; background-position:top; background-repeat:no-repeat; background-attachment:fixed; font:normal 12px arial; color:#000; } /******************************************************************************************************************* DIFFERENT BACKGROUND IMAGES ********************************************************************************************************************/ body.homepage-1 { background-image:url(/images/bg-homepage-1.jpg); } body.homepage-2 { background-image:url(/images/bg-homepage-2.jpg); } body.homepage-3 { background-image:url(/images/bg-homepage-3.jpg); } body.portfolio-1 { background-image:url(/images/bg-portfolio-1.jpg); } body.portfolio-2 { background-image:url(/images/bg-portfolio-2.jpg); } body.portfolio-3 { background-image:url(/images/bg-portfolio-3.jpg); } body.years_25-1 { background-image:url(/images/bg-25years-1.jpg); } body.years_25-2 { background-image:url(/images/bg-25years-1.jpg); } /* Copied in case randomizer chooses */ body.years_25-3 { background-image:url(/images/bg-25years-1.jpg); } /* Copied in case randomizer chooses */ body.news-1 { background-image:url(/images/bg-news-1.jpg); } body.news-2 { background-image:url(/images/bg-news-2.jpg); } body.news-3 { background-image:url(/images/bg-news-3.jpg); } body.about-1 { background-image:url(/images/bg-about-1.jpg); } body.about-2 { background-image:url(/images/bg-about-2.jpg); } body.about-3 { background-image:url(/images/bg-about-3.jpg); } body.contact-1 { background-image:url(/images/bg-contact-1.jpg); } body.contact-2 { background-image:url(/images/bg-contact-2.jpg); } body.contact-3 { background-image:url(/images/bg-contact-3.jpg); } /*div.bg-80 { position:absolute; top:0; left:50%; width:930px; margin-left:-465px; background:#FFF; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; }*/ div.wrapper { display:none; position:relative; width:900px; margin:0 auto; text-align:left; padding:0 15px 15px 15px; background:url(/images/bg_80.png); } /* common elements and arrows */ div.divider { position:relative; height:1px; background:#b2b2b2; margin:5px 0; font-size:0px; } .arrow-11-orange span { position:relative; left:6px; top:1px; } .arrow-11-white span { position:relative; left:6px; top:1px; } .arrow-8-white span { position:relative; left:6px; top:0px; } /******************************************************************************************************************* HEADER ********************************************************************************************************************/ div.header { z-index:2; position:relative; height:145px; background:#FFF; } /* left and right shadows */ div.shadow-left { position:absolute; top:155px; left:-19px; width:19px; height:324px; background:url(/images/homepage/flash-shadow-left.png) 0 0 no-repeat; } div.shadow-right { position:absolute; top:155px; right:-19px; width:19px; height:324px; background:url(/images/homepage/flash-shadow-right.png) 0 0 no-repeat; } /* to allow for rotation to go over backgound but still have click able nav items we add background as a separate element */ div.bg-header { z-index:1; position:absolute; top:0; left:50%; margin-left:-450px; width:900px; height:145px; background:#FFF; } div.header img.logo { position:absolute; top:27px; left:10px; } div.header img.icon { position:absolute; top:23px; right:30px; } div.header ul.nav { position:absolute; bottom:2px; left:5px; } div.header ul.nav li { float:left; color:#948671; text-transform:uppercase; font-weight:bold; font-size:14px; } div.header ul.nav li.divider { padding-top:9px; } div.header ul.nav li a { cursor:pointer; display:block; float:left; text-decoration:none; color:#000; padding:10px 15px; } div.header ul.nav li a:hover, div.header ul.nav li.sticky a { color:#ff6600; } /******************************************************************************************************************* THREE THINGS ********************************************************************************************************************/ div.three-things { z-index:100; position:relative; height:40px; overflow:visible; } div.three-things div.shadow { position:absolute; top:-25px; left:0px; width:900px; height:25px; background:url(/images/homepage/flash-shadow.png) bottom repeat-x; } div.three-things div.container { position:absolute; bottom:0; left:0; width:900px; background:#a29680 url(/images/bg-three-things.jpg) 0 0 repeat-y; height:42px; overflow:hidden; } div.three-things h1 { color:#FFF; font-size:16px; padding:10px 20px; cursor:pointer; background:url(/images/bg-three-things-h1.jpg) 0 0 repeat-y; } div.three-things h1 strong { color:#000; font-size:18px; font-weight:normal; } div.three-things h2 { color:#FFF; text-transform:uppercase; font-weight:bold; border-bottom:1px solid #FFF; padding-bottom:3px; } div.three-things p { margin:5px 0; } div.three-things ul { margin:10px 0; color:#FFF; font-size:11px; } div.three-things ul li { margin:3px 0; } div.three-things a.close { cursor:pointer; visibility:hidden; display:block; position:absolute; top:10px; right:15px; width:10px; height:10px; padding:5px; background:#FF6600 url(/images/three-things-close.gif) 5px 5px no-repeat; } div.three-things div.analysis { float:left; width:260px; padding:20px; } div.three-things div.architecture { float:left; width:260px; padding:20px; } div.three-things div.activation { float:left; width:260px; padding:20px; } /* alter states based on open/closed*/ div.three-things div.open { overflow:visible; } div.three-things div.open h1 { cursor:auto; background:url(/images/bg-three-things.jpg) 0 0 repeat-y; } div.three-things div.open a.close { visibility:visible; } /******************************************************************************************************************* FOOTER ********************************************************************************************************************/ div.footer { position:relative; background:#FFF; padding:18px 20px; font-size:11px; } div.footer ul.social { float:right; color:#423b31; } div.footer ul.social li { float:left; margin:0 0 0 4px; } div.footer ul.social li label { text-transform:uppercase; position:relative; top:4px; left:-3px; } div.footer ul.social li a { display:block; float:left; width:22px; height:23px; } div.footer ul.social li#facebook a { background:url(/images/footer-sprite-social.gif) 0 0 no-repeat; } div.footer ul.social li#twitter a { background:url(/images/footer-sprite-social.gif) -29px 0 no-repeat; } div.footer ul.social li#linkedin a { background:url(/images/footer-sprite-social.gif) -59px 0 no-repeat; } div.footer ul.social li#youtube a { background:url(/images/footer-sprite-social.gif) -88px 0 no-repeat; } div.footer ul.social li#flickr a { background:url(/images/footer-sprite-social.gif) -116px 0 no-repeat; } div.footer ul.social li#tumblr a { background:url(/images/tumblr.jpg) no-repeat; } div.footer ul.nav { color:#423b31; text-transform:uppercase; margin:0 0 15px 0; } div.footer ul.nav li { display:inline; margin:0 1px 0 0; } div.footer ul.nav li a { color:#423b31; } div.footer ul.nav li a:hover { color:#ff6600; } div.footer ul.contact { color:#948671; } div.footer ul.contact li { display:inline; margin:0 1px 0 0; } div.footer ul.contact li a { color:#948671; text-decoration:none; } div.footer ul.contact li a:hover { color:#ff6600; } /******************************************************************************************************************* HOMEPAGE ********************************************************************************************************************/ div.homepage-flash { z-index:1; position:relative; height:461px; margin-top:-156px; width:900px; overflow:hidden; } /* rotator */ div.homepage-flash ul.rotate { z-index:7; position:absolute; bottom:0; left:0; height:305px; } /* width needs to go onto infinity or to be calculated by javascript for the exact width of all rotations */ div.homepage-flash ul.rotate li { position:relative; float:left; width:900px; height:305px; } /* flash shadow sits in front of the rotation and just above the controller */ div.homepage-flash div.shadow { z-index:8; position:absolute; bottom:21px; left:0px; width:900px; height:25px; background:url(/images/homepage/flash-shadow.png) bottom repeat-x; } /* homepage rotate control */ div.homepage-flash ul.control { z-index:9; position:absolute; bottom:0px; left:0px; width:100%; background:url(/images/homepage/bg-flash-control.gif) bottom repeat-x; } div.homepage-flash ul.control li { position:relative; float:left; color:#948671; text-transform:uppercase; font-weight:bold; font-size:11px; } div.homepage-flash ul.control li div.arrow { display:none; position:absolute; top:-4px; left:50%; margin-left:-8px; width:16px; height:6px; background:url(/images/homepage/flash-control-arrow.png) 0 0 no-repeat; } div.homepage-flash ul.control li a { cursor:pointer; display:block; float:left; text-decoration:none; color:#000; padding:5px 12px 4px 12px; } /* set hover and active states for controls */ div.homepage-flash ul.control li a:hover, div.flash ul.control li.hover a { background:url(/images/homepage/bg-flash-control-active.gif) bottom repeat-x; } div.homepage-flash ul.control li.active a { background:url(/images/homepage/bg-flash-control-active.gif) bottom repeat-x; } div.homepage-flash ul.control li.active div.arrow { display:block; } /* homepage left */ div.columns { position:relative; width:900px; height:185px; padding:0px; z-index:99; } div.homepage-left { cursor:pointer; position:absolute; width:465px; background:#FFF; padding:0px 20px 25px; height:161px; bottom:0px; left:0px; } div.homepage-left h1 { color:#ff6600; font-size:18px; margin:25px 0 0 0; } div.homepage-left p { color:#948671; font-size:16px; margin:8px 0; line-height:1.4em; } div.homepage-left a { color:#948671; text-decoration:none; } /* homepage right */ div.homepage-right { position:absolute; width:347px; background:#cac2b1; padding:13px 20px; height:157px; right:0px; bottom:0px; z-index:9; border:0px solid yellow; margin:0px; overflow:hidden; border:0px solid blue; border-bottom:3px solid #cac2b1; } div.homepage-right h2 { color:#FFF; text-transform:uppercase; font-weight:bold; margin:0px;margin-bottom:15px; } div.homepage-right a.expand { position:absolute; top:10px; right:20px; color:#FF6600; text-decoration:none; font-weight:bold; cursor:pointer; font-size:16px; } div.homepage-right a.expand:hover { color:#000; } div.homepage-right div.twitter { width:347px; height:800px; overflow:hidden; margin:5px 0 0 0; } div.homepage-right div#news-container{ overflow:hidden; } div.homepage-right div#news-container ul.social_feed{ display:none; } div.homepage-right div#news-container .social_img{ width:48px;float:left;margin:0px;} div.homepage-right div#news-container .title{font-weight:bold;padding-left:53px;margin:0px;} div.homepage-right div#news-container .social_message{ padding-left:53px;} div.homepage-right div#news-container .spacer{ clear:both;padding-bottom:15px; } /******************************************************************************************************************* PORTFOLIO ********************************************************************************************************************/ div.studies { z-index:9; position:relative; height:24px; overflow:visible; } div.studies div.container { position:absolute; top:0; left:0; width:900px; height:24px; overflow:hidden; background:#FFF; } div.studies h1 { cursor:pointer; padding:5px 20px; color:#FFF; text-transform:uppercase; font-size:11px; font-weight:bold; } div.studies h1.open { background:#FF6600 url(/images/portfolio/bg-case-study-h1.gif) 104px 9px no-repeat; } div.studies h1.close { display:none; background:#FF6600 url(/images/portfolio/bg-case-study-h1-active.gif) 104px 10px no-repeat; } div.studies ul { background:#e0dad0; margin:10px 10px 2px 10px; height:25px; padding:0 5px; } div.studies ul li { float:left; font-size:11px; font-weight:bold; margin:0 15px 0 0; } div.studies ul li label { color:#948671; text-transform:uppercase; display:block; padding:5px; } div.studies ul li a { cursor:pointer; display:block; float:left; color:#948671; text-decoration:none; padding:5px 10px 5px 5px; background:url(/images/portfolio/bg-case-study-ul-li.gif) right 9px no-repeat; } div.studies ul li a:hover { color:#FF6600; background:url(/images/portfolio/bg-case-study-ul-li-hover.gif) right 9px no-repeat; } div.studies ul li.active a { color:#FF6600; background:url(/images/portfolio/bg-case-study-ul-li-active.gif) right 10px no-repeat; } div.studies table { background:#f4f2ef; margin:2px 10px 10px 10px; width:880px; } div.studies table td { padding:10px; } div.studies table td a { cursor:pointer; float:left; display:block; height:15px; padding:4px 25px 3px 5px; color:#000; text-decoration:none; } div.studies table td a.active:hover { background:#FF6600 url(/images/portfolio/bg-case-study-table-td.gif) right 0 no-repeat; } /* modify studies tab to remove "dropdown" ability to make it a more standard block element */ body.portfolio-home div.studies { height:auto; } body.portfolio-home div.studies div.container { position:relative; height:auto; } body.portfolio-home div.studies h1 { cursor:auto; background:#FF6600 url(/images/portfolio/bg-case-study-h1-active.gif) 104px 10px no-repeat; } /* portfolio rotate */ div.portfolio-flash { z-index:8; position:relative; height:430px; width:880px; overflow:hidden; border:10px solid #FFF; } /* rotator */ div.portfolio-flash ul.rotate { z-index:7; position:absolute; bottom:0; left:0; height:430px; } /* width needs to go onto infinity or to be calculated by javascript for the exact width of all rotations */ div.portfolio-flash ul.rotate li { position:relative; float:left; width:880px; height:430px; } div.portfolio-flash ul.rotate li div.text { position:absolute; bottom:0; left:0; width:880px; padding:15px 0; font-size:15px; text-align:center; color:#FFF; background:url(/images/bg-black-80.png); } /* control */ div.portfolio-flash ul.control { position:absolute; bottom:0; left:0; z-index:9; height:430px; width:880px; } div.portfolio-flash ul.control li { position:absolute; top:50%; margin-top:-20px; cursor:pointer; text-transform:uppercase; font-size:11px; color:#FFF; } div.portfolio-flash ul.control li.back { display:none; left:10px; text-align:left; } div.portfolio-flash ul.control li.back a { display:block; background:url(/images/arrow-back.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 4px 4px 12px; } div.portfolio-flash ul.control li.back a:hover { background:url(/images/arrow-back-active.png) 0 0 no-repeat; } div.portfolio-flash ul.control li.next { right:10px; text-align:right; } div.portfolio-flash ul.control li.next a { display:block; background:url(/images/arrow-next.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 12px 4px 4px; } div.portfolio-flash ul.control li.next a:hover { background:url(/images/arrow-next-active.png) 0 0 no-repeat; } /* portfolio callouts */ div.portfolio-callouts { background:#FFF; padding:10px; } div.portfolio-callout-1 { float:left; width:287px; background:#eae7e3; height:150px; } div.portfolio-callout-2 { float:left; width:287px; background:#eae7e3; height:150px; margin:0 0 0 10px; } div.portfolio-callout-3 { float:right; width:287px; background:#eae7e3; height:150px; } /* case study content */ div.case-study-text { background:#FFF; padding:10px 20px 20px 20px; } div.case-study-text h1 { font-size:20px; color:#FF6600; } div.case-study-text p { margin:6px 0; font-size:14px; text-transform:uppercase; width:100%; color:#4c463d; } div.case-study-text span { color:#000; font-weight:bold; } div.case-study-text a { font-size:11px; text-transform:uppercase; color:#FF6600; text-decoration:none; font-weight:bold; padding:0 8px 0 0; background:url(/images/portfolio/bg-case-study-text-a.gif) right 3px no-repeat; } div.case-study-text a:hover { color:#000; background:url(/images/portfolio/bg-case-study-text-a-active.gif) right 3px no-repeat; } div.case-study-text table { width:100%; background:#f4f3f1; margin:10px 0; } div.case-study-text table td.head { text-transform:uppercase; color:#000000; font:bold 12px arial; padding:8px 10px 0px; } div.case-study-text table td { padding:10px; width:33%; } div.case-study-text table td h2 { color:#948671; text-transform:uppercase; font-weight:bold; font-size:14px; padding-bottom:3px; border-bottom:1px solid #948671; } div.case-study-text table td ul { font-size:11px; margin:5px 0; } div.case-study-text table td ul li { margin:3px 0; } /******************************************************************************************************************* NEWS ********************************************************************************************************************/ div.news h1 { background:#ff6600; color:#FFF; font-size:20px; padding:7px 20px; width:860px; } div.news h2 { font-size:18px; color:#4c463d; margin:6px 0; } div.news p { color:#6c6253; margin:6px 0; line-height:16px; font-size:12px; } div.news td.highlights { width:300px; background:#FFF; padding:20px; vertical-align:top; } div.news td.highlights div.highlight-1 { padding:0 0 5px 0; border-bottom:1px solid #d4cfc6; margin:0 0 15px 0; } div.news td.highlights div.highlight-1 img { width:300px; border:1px solid #CCCCCC; } div.news td.highlights div.highlight-2 { float:left; width:142px; } div.news td.highlights div.highlight-2 img { width:142px; border:1px solid #CCCCCC; } div.news td.highlights div.highlight-3 { float:right; width:142px; } div.news td.highlights div.highlight-3 img { width:142px; border:1px solid #CCCCCC; } div.news a.plus { color:#FF6600; text-decoration:none; font-weight:bold; padding:5px; position:relative; left:-3px; top:1px; font-size:16px; } div.news a.plus:hover { color:#000; } div.news td.highlights div.signup { width:300px; padding:15px 0 0 0; border-top:1px solid #d4cfc6; margin:15px 0; } div.news td.highlights div.signup h3 { width:194px; height:26px; background:url(/images/news/bg-inner-worx.gif) 0 0 no-repeat; } div.news td.highlights div.signup h3 span { display:none; } div.news td.highlights div.signup p { margin:10px 0; } div.news td.highlights div.signup a { padding:4px 16px 4px 4px; background:#948671 url(/images/news/bg-in-the-worx-a.gif) right 0 no-repeat; color:#FFF; text-decoration:none; font-size:10px; text-transform:uppercase; } div.news td.highlights div.signup a:hover { background:#000 url(/images/news/bg-in-the-worx-a-active.gif) right 0 no-repeat; } div.news td.spacer { width:10px; } div.news td.main { width:490px; background:#FFF; padding:20px 30px; vertical-align:top; } div.news td.main div.highlight { position:relative; padding:0 0 10px 0; border-bottom:1px solid #d4cfc6; margin:0 0 15px 0; background:#FFF; } div.news td.main div.highlight img { border:1px solid #CCCCCC; } div.news td.main div.last { border-bottom:0; } div.news td.main div.highlight img { float:left; width:90px; margin:4px 15px 10px 0; } div.news td.main div.highlight div.content { float:right; width:380px; } div.news td.main div.highlight div.content h2 { margin:0; } div.news td.main div.highlight div.full { display:none; } div.news a.open { background:#FFF; cursor:pointer; color:#FF6600; text-decoration:none; font-weight:bold; font-size:11px; text-transform:uppercase; padding:0 13px 0 0; background:url(/images/news/bg-open.gif) right 3px no-repeat; } div.news a.open:hover { color:#000; } div.news a.close { display:none; background:#FFF; cursor:pointer; color:#FF6600; text-decoration:none; font-weight:bold; font-size:11px; text-transform:uppercase; padding:0 13px 0 0; background:url(/images/news/bg-close.gif) right 4px no-repeat; } div.news a.close:hover { color:#000; } /******************************************************************************************************************* ABOUT ********************************************************************************************************************/ div.about { background:#FFF; height:620px; } div.about div.shade { position:relative; margin:0 0 2px 0; } div.about div.shade h2 { cursor:pointer; margin:0 0 2px 0; padding:6px 0 0 10px; width:450px; height:19px; background:url(/images/about/bg-shade-h2.png) right 0 no-repeat; color:#FFF; text-transform:uppercase; font-size:11px; } div.about div.active h2, div.about div.shade h2.hover { background:url(/images/about/bg-shade-h2-active.png) right 0 no-repeat; } div.about div.shade-content { display:none; overflow:hidden; position:relative; width:900px; height:433px; background:#FFF url(/images/about/bg-shade-content.gif) bottom repeat-x; } div.about div.shade-content div.hidden { display:none; position:relative; width:900px; height:433px; } div.about div.shade-content div.loading { position:absolute; top:50%; left:50%; margin:-16px 0 0 -16px; width:32px; height:32px; background:url(/images/ajax-loader.gif) 0 0 no-repeat; } div.about div#shade-1 { background:url(/images/about/1/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-2 { background:url(/images/about/2/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-3 { background:url(/images/about/3/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-4 { background:url(/images/about/4/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-5 { background:url(/images/about/5/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-6 { background:url(/images/about/6/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-7 { background:url(/images/about/7/bg-strip.jpg) right 0 no-repeat; } div.about div#shade-8 { background:url(/images/about/8/bg-strip.jpg) right 0 no-repeat; } /******************************************************************************************************************* WINDOW SHADE 1 ********************************************************************************************************************/ div.about div#shade-1 ul.numeric { position:absolute; z-index:9; top:10px; left:0px; font-size:48px; } div.about div#shade-1 ul.numeric li { cursor:pointer; display:inline; padding:10px 24px; color:#c1b5a4; } div.about div#shade-1 ul.numeric li a:hover, div.about div#shade-1 ul.numeric li.active a { color:#FF6600; } div.about div#shade-1 ul.linear { position:absolute; z-index:9; bottom:30px; left:60px; width:420px; height:20px; font-size:11px; text-transform:uppercase; } div.about div#shade-1 ul.linear li#prev { position:absolute; top:0; left:9px; } div.about div#shade-1 ul.linear li#next { position:absolute; top:0; right:9px; } div.about div#shade-1 ul.linear li a { cursor:pointer; color:#FFF; background:#948671; text-decoration:none; display:block; height:12px; padding:4px; font-size:10px; } div.about div#shade-1 ul.linear li a:hover { background:#000; } div.about div#shade-1 ul.linear li#prev a span { position:absolute; left:-9px; top:0; background:url(/images/about/bg-arrow-left.png) 0 0 no-repeat; width:9px; height:20px; } div.about div#shade-1 ul.linear li#prev a:hover span { background:url(/images/about/bg-arrow-left-active.png) 0 0 no-repeat; } div.about div#shade-1 ul.linear li#next a span { position:absolute; right:-9px; top:0; background:url(/images/about/bg-arrow-right.png) 0 0 no-repeat; width:9px; height:20px; } div.about div#shade-1 ul.linear li#next a:hover span { background:url(/images/about/bg-arrow-right-active.png) 0 0 no-repeat; } div.about div#shade-1 div.content { position:absolute; z-index:8; width:900px; height:363px; top:70px; overflow:hidden; } div.about div#shade-1 div.content ul { position:absolute; top:0; left:0; height:363px; } /* width determined by JavaScript */ div.about div#shade-1 div.content ul li { position:relative; float:left; width:900px; height:363px; } /* common elements within each slide */ div.about div#shade-1 ul li h3 { position:absolute; top:0; background:#FF6600; padding:5px; color:#FFF; font-size:11px; text-transform:uppercase; } div.about div#shade-1 ul li div.quote { position:absolute; top:55px; left:35px; padding:10px 35px 20px 30px; width:420px; background:url(/images/about/1/bg-quote.gif) 0 0 no-repeat; } div.about div#shade-1 ul li div.quote p { color:#4c463d; font-size:18px; margin:10px 0; } div.about div#shade-1 ul li div.quote p.team-member { color:#948671; font-weight:bold; font-size:11px; text-transform:uppercase; } /* background images and h3 position for each slide */ div.about div#shade-1 ul li#slide-1 { background:url(/images/about/1/bg-1.gif) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-1 h3 { left:24px; } div.about div#shade-1 ul li#slide-2 { background:url(/images/about/1/bg-2.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-2 h3 { left:110px; } div.about div#shade-1 ul li#slide-3 { background:url(/images/about/1/bg-3.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-3 h3 { left:200px; } div.about div#shade-1 ul li#slide-4 { background:url(/images/about/1/bg-4.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-4 h3 { left:285px; } div.about div#shade-1 ul li#slide-5 { background:url(/images/about/1/bg-13.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-5 h3 { left:375px; } div.about div#shade-1 ul li#slide-6 { background:url(/images/about/1/bg-2.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-6 h3 { right:405px; } div.about div#shade-1 ul li#slide-7 { background:url(/images/about/1/bg-4.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-7 h3 { right:320px; } div.about div#shade-1 ul li#slide-8 { background:url(/images/about/1/bg-8.jpg) 520px bottom no-repeat; } div.about div#shade-1 ul li#slide-8 h3 { right:230px; } div.about div#shade-1 ul li#slide-9 { background:url(/images/about/1/bg-3-alt.jpg) 490px bottom no-repeat; } div.about div#shade-1 ul li#slide-9 h3 { right:145px;} div.about div#shade-1 ul li#slide-10 { background:url(/images/about/1/bg-10.jpg) 530px bottom no-repeat; } div.about div#shade-1 ul li#slide-10 h3 { right:30px; } /******************************************************************************************************************* WINDOW SHADE 2 ********************************************************************************************************************/ div.about div#shade-2 div.shade-content { text-align:center; padding:40px 0 0 0; height:393px; } /* controls */ div.about div#shade-2 ul.controls { position:absolute; z-index:9; top:13px; left:40px; text-align:left; font-size:11px; text-transform:uppercase; } div.about div#shade-2 ul.controls li { margin:2px 0; background:url(/images/about/2/button.gif) 0 0 no-repeat; width:123px; height:20px; } div.about div#shade-2 ul.controls li.active, div.about div#shade-2 ul.controls li.hover { background:url(/images/about/2/button-active.gif) 0 0 no-repeat; } div.about div#shade-2 ul.controls li a { cursor:pointer; color:#FFF; text-decoration:none; display:block; padding:3px 3px 3px 8px; } /* slider content */ div.about div#shade-2 div.content { position:relative; overflow:hidden; width:900px; height:393px; } div.about div#shade-2 div.content ul { position:absolute; z-index:8; top:0; left:0; width:1800px; } div.about div#shade-2 div.content ul li { float:left; width:900px; height:300px; } div.about div#shade-2 p { text-align:left; color:#4c463d; font-size:16px; margin:10px 210px 40px 210px; } div.about div#shade-2 table { margin:20px auto; width:90%; } div.about div#shade-2 table td { padding:0 20px; text-align:center; vertical-align:middle; } /******************************************************************************************************************* WINDOW SHADE 3 ********************************************************************************************************************/ div.about div#shade-3 div.shade-content { text-align:center; padding:40px 0 0 0; height:393px; } div.about div#shade-3 p { text-align:left; color:#4c463d; font-size:16px; margin:10px 200px; } div.about div#shade-3 a.gdusa { color:#FF6600; font-size:18px; font-weight:normal; text-transform:uppercase; text-decoration:none; } div.about div#shade-3 a.gdusa:hover { text-decoration:underline; } div.about div#shade-3 p strong { color:#FF6600; font-size:18px; font-weight:normal; text-transform:uppercase; } div.about div#shade-3 table { margin:20px auto; } div.about div#shade-3 table td { padding:0 12px; } /******************************************************************************************************************* WINDOW SHADE 4 ********************************************************************************************************************/ div.about div#shade-4 div.shade-content { } /* slider content */ div.about div#shade-4 ul { position:absolute; z-index:8; top:0; left:0; } div.about div#shade-4 ul li { float:left; width:900px; height:433px; } div.about div#shade-4 ul li h3 { position:relative; z-index:9; color:#FF6600; font-size:20px; } div.about div#shade-4 ul li h4 { position:relative; z-index:9; color:#948671; font-size:11px; text-transform:uppercase; font-weight:bold; } /* set up bios types */ div.about div#shade-4 div.bio { position:relative; z-index:9; border:1px solid #948671; border-width:1px 0; padding:4px 0; margin:10px 0; } div.about div#shade-4 div.bio a { cursor:pointer; font-size:10px; text-transform:uppercase; font-weight:bold; color:#948671; padding-right:10px; background:url(/images/about/4/arrow-right-gray.gif) right 2px no-repeat; margin:0 20px 0 0; } div.about div#shade-4 div.bio a:hover { color:#FF6600; background:url(/images/about/4/arrow-right-orange.gif) right 2px no-repeat; } div.about div#shade-4 div.bio a.active { color:#FF6600; background:url(/images/about/4/arrow-down-orange.gif) right 4px no-repeat; } div.about div#shade-4 div.bio-content { height:250px; overflow:hidden; display:none; } div.about div#shade-4 div.bio-content p { font-size:11px; margin:0 0 8px 0; } div.about div#shade-4 div.bio-content strong { display:block; margin:5px 0; font-size:14px; } div.about div#shade-4 div.bio-content table { margin:5px 0; background:#f2f0ee; font-size:10px; } div.about div#shade-4 div.bio-content td { padding:12px; width:33%; } div.about div#shade-4 div.bio-content td a { color:#FF6600; } div.about div#shade-4 div.bio-content td a:hover { color:#000; } /* slides */ div.about div#shade-4 ul li.joe { padding:15px 25px 0 350px; width:525px; height:418px; background:url(/images/about/4/bg-joe.gif) 5px bottom no-repeat; } div.about div#shade-4 ul li.grant { padding:15px 25px 0 350px; width:525px; height:418px; background:url(/images/about/4/bg-grant.jpg) 5px bottom no-repeat; } /*div.about div#shade-4 ul li.George { padding:15px 25px 0 350px; width:525px; height:418px; background:url(/images/about/4/bg-george.gif) 5px bottom no-repeat; }*/ div.about div#shade-4 ul li.Andrea { padding:15px 25px 0 350px; width:525px; height:418px; background:url(/images/about/4/bg-andrea.gif) 5px bottom no-repeat; } div.about div#shade-4 ul li.Mike { padding:15px 25px 0 350px; width:525px; height:418px; background:url(/images/about/4/bg-mike-sansone.png) 5px bottom no-repeat; } /* controls */ div.about div#shade-4 div.controls { position:absolute; z-index:9; bottom:15px; left:350px; width:525px; font-size:10px; text-transform:uppercase; margin:10px 0; } div.about div#shade-4 div.controls label { background:url(/images/about/4/arrow-down-orange.gif) 100px 8px no-repeat; display:block; border:1px solid #948671; border-width:1px 0; padding:4px 0; font-size:10px; text-transform:uppercase; font-weight:bold; color:#FF6600; margin:5px 0; } div.about div#shade-4 div.controls a { position:relative; cursor:pointer; display:block; float:left; background:#948671; color:#FFF; text-decoration:none; height:12px; padding:5px 3px 3px 4px; margin:0 16px 0 0; font-size:9px; } div.about div#shade-4 div.controls a:hover { background:#000; } div.about div#shade-4 div.controls a span { position:absolute; right:-9px; top:0; background:url(/images/about/bg-arrow-right.png) 0 0 no-repeat; width:9px; height:20px; } div.about div#shade-4 div.controls a:hover span { background:url(/images/about/bg-arrow-right-active.png) 0 0 no-repeat; } /******************************************************************************************************************* WINDOW SHADE 5 ********************************************************************************************************************/ div.about div#shade-5 div.shade-content { overflow:hidden; } /* content */ div.about div#shade-5 ul.content { position:absolute; top:0; left:0; } div.about div#shade-5 ul.content li { float:left; width:900px; height:433px; position:relative; } div.about div#shade-5 ul.content li#content-1 { background:url(/images/about/5/bg-1.jpg) 0 0 no-repeat; color:#D2D1B5; } div.about div#shade-5 ul.content li#content-2 { background:url(/images/about/5/bg-2.jpg) 0 0 no-repeat; color:#D2D1B5; } div.about div#shade-5 ul.content li#content-3 { background:url(/images/about/5/bg-3.jpg) 0 0 no-repeat; color:#948671; } div.about div#shade-5 ul.content li#content-4 { background:url(/images/about/5/bg-4.jpg) 0 0 no-repeat; color:#948671; } div.about div#shade-5 ul.content li#content-5 { background:url(/images/about/5/bg-5.jpg) 0 0 no-repeat; color:#948671; } div.about div#shade-5 ul.content li#content-6 { background:url(/images/about/5/bg-6.jpg) 0 0 no-repeat; color:#948671; } /* control */ div.about div#shade-5 ul.control { position:absolute; bottom:0; left:0; z-index:9; height:430px; width:900px; } div.about div#shade-5 ul.control li { position:absolute; top:50%; margin-top:-20px; cursor:pointer; text-transform:uppercase; font-size:11px; color:#FFF; } div.about div#shade-5 ul.control li.back { display:none; left:10px; text-align:left; } div.about div#shade-5 ul.control li.back a { display:block; background:url(/images/arrow-back.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 4px 4px 12px; } div.about div#shade-5 ul.control li.back a:hover { background:url(/images/arrow-back-active.png) 0 0 no-repeat; } div.about div#shade-5 ul.control li.next { right:10px; text-align:right; } div.about div#shade-5 ul.control li.next a { display:block; background:url(/images/arrow-next.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 12px 4px 4px; } div.about div#shade-5 ul.control li.next a:hover { background:url(/images/arrow-next-active.png) 0 0 no-repeat; } /******************************************************************************************************************* WINDOW SHADE 6 ********************************************************************************************************************/ div.about div#shade-6 div.shade-content div.hidden { background:url(/images/about/6/worx_about_give_back.jpg) 0 0 no-repeat; } div.about div#shade-6 div.shade-content h3 { color:#FFF; font-size:18px; position:absolute; top:20px; left:30px; } div.about div#shade-6 div.shade-content p { color:#FFF; font-size:11px; position:absolute; bottom:20px; left:30px; width:320px; } /******************************************************************************************************************* WINDOW SHADE 8 ********************************************************************************************************************/ div.about div#shade-8 div.bg { z-index:1; position:absolute; top:0; left:0; width:900px; height:433px; overflow:hidden; } div.about div#shade-8 div.bg ul { position:absolute; top:0; left:0; height:433px; } /* width determined by JavaScript */ div.about div#shade-8 div.bg ul li { float:left; width:900px; height:433px; } div.about div#shade-8 div.bar { z-index:8; position:absolute; top:40px; left:50%; margin:0 0 0 -380px; background:url(/images/about/8/bg-bar.png) 0 0 no-repeat; width:763px; height:80px; } /* window shade 8 phrase slider */ div.about div#shade-8 div.ticker { z-index:9; position:absolute; top:40px; left:50%; margin:0 0 0 -380px; width:763px; height:80px; } div.about div#shade-8 div.ticker label { position:absolute; top:28px; left:20px; color:#FFF; font-size:18px; } div.about div#shade-8 div.ticker div.content { overflow:hidden; position:absolute; top:22px; left:100px; color:#000; font-size:18px; background:url(/images/about/8/bg-bar-div.gif) 0 0 no-repeat; width:550px; height:35px; } div.about div#shade-8 div.ticker div.content ul { } div.about div#shade-8 div.ticker div.content ul li { float:left; width:530px; height:23px; padding:6px 10px; } div.about div#shade-8 div.ticker ul.control { position:absolute; top:32px; right:70px; } div.about div#shade-8 div.ticker ul.control li { cursor:pointer; display:inline; margin:0 0 0 5px; } /******************************************************************************************************************* CONTACT ********************************************************************************************************************/ div.contact { background:#FFF; height:536px; } div.contact div.shade { position:relative; margin:0 0 2px 0; } div.contact div.shade h2 { cursor:pointer; margin:0 0 2px 0; padding:6px 0 0 10px; width:450px; height:19px; background:url(/images/about/bg-shade-h2.png) right 0 no-repeat; color:#FFF; text-transform:uppercase; font-size:11px; } div.contact div.active h2, div.contact div.shade h2.hover { background:url(/images/about/bg-shade-h2-active.png) right 0 no-repeat; } div.contact div.shade-content { display:none; overflow:hidden; position:relative; width:900px; height:433px; background:#FFF url(/images/about/bg-shade-content.gif) bottom repeat-x; } div.contact div.shade-content div.hidden { display:none; position:relative; width:900px; height:433px; } div.contact div.shade-content div.loading { position:absolute; top:50%; left:50%; margin:-16px 0 0 -16px; width:32px; height:32px; background:url(/images/ajax-loader.gif) 0 0 no-repeat; } /******************************************************************************************************************* WINDOW SHADE 1 ********************************************************************************************************************/ div.contact div#shade-1 { background:url(/images/contact/1/bg-strip.jpg) right 0 no-repeat; } div.contact div#shade-1 div.hidden { background:url(/images/contact/1/bg.jpg) 0 0 no-repeat; } div.contact div#shade-1 div.black-70 { position:absolute; bottom:30px; right:30px; width:400px; height:285px; background:url(/images/contact/black-70.png); } div.contact div#shade-1 div.content { position:absolute; bottom:30px; right:30px; padding:30px; width:340px; height:225px; color:#FFF; } div.contact div#shade-1 div.content h3 { font-size:18px; } div.contact div#shade-1 div.content table { width:300px; margin:10px 0; } div.contact div#shade-1 div.content ul { font-size:10px; text-transform:uppercase; margin:10px 0; } div.contact div#shade-1 div.content ul li { margin:15px 0; } div.contact div#shade-1 div.content ul li a { position:relative; padding:4px; background:#948671; color:#FFF; text-decoration:none; } div.contact div#shade-1 div.content ul li a:hover { background:#000; } div.contact div#shade-1 div.content ul li a span { position:absolute; right:-9px; top:0; background:url(/images/contact/bg-arrow-right.png) 0 0 no-repeat; width:9px; height:20px; } div.contact div#shade-1 div.content ul li a:hover span { background:url(/images/contact/bg-arrow-right-active.png) 0 0 no-repeat; } /******************************************************************************************************************* WINDOW SHADE 2 ********************************************************************************************************************/ div.contact div#shade-2 { background:url(/images/contact/2/bg-strip.jpg) right 0 no-repeat; } div.contact div#shade-2 div.hidden { background:url(/images/contact/2/bg.jpg) 0 0 no-repeat; } div.contact div#shade-2 div.content { position:absolute; top:220px; left:30px; width:270px; color:#FFF; } div.contact div#shade-2 div.content h3 { font-size:18px; text-transform:uppercase; } div.contact div#shade-2 div.content p { font-size:12px; margin:10px 0 20px 0; } div.contact div#shade-2 div.content a { position:relative; padding:4px; background:#948671; color:#FFF; text-decoration:none; font-size:10px; text-transform:uppercase; } div.contact div#shade-2 div.content a:hover { background:#000; } div.contact div#shade-2 div.content a span { position:absolute; right:-9px; top:0; background:url(/images/contact/bg-arrow-right.png) 0 0 no-repeat; width:9px; height:20px; } div.contact div#shade-2 div.content a:hover span { background:url(/images/contact/bg-arrow-right-active.png) 0 0 no-repeat; } div.contact div#shade-2 ul { position:absolute; top:23px; right:20px; width:370px; color:#FFF; } div.contact div#shade-2 ul li { margin:0 0 5px 0; } div.contact div#shade-2 ul li a { cursor:pointer; display:block; padding:5px 10px; background:#5d4739 url(/images/contact/2/bg-ul-li-right.gif) 353px 8px no-repeat; text-decoration:none; font-weight:bold; } div.contact div#shade-2 ul li.active a { background:#5d4739 url(/images/contact/2/bg-ul-li-down.gif) 350px 10px no-repeat; } div.contact div#shade-2 ul li div.career { height:195px; display:none; position:relative; } div.contact div#shade-2 ul li div.career div.black-70 { position:absolute; top:0; left:0; width:370px; height:195px; background:url(/images/contact/black-70.png); } div.contact div#shade-2 ul li div.career ul { position:relative; width:auto; top:0; left:0; padding:15px 15px 5px 15px; } div.contact div#shade-2 ul li div.career ul li { margin:0 0 10px 0; } div.contact div#shade-2 ul li div.career a { position:relative; margin:0 15px; display:inline; padding:0 10px 0 0; background:url(/images/contact/2/bg-career-link.gif) right 3px no-repeat; text-decoration:none; font-weight:normal; color:#FFF; text-transform:uppercase; font-size:11px; } div.contact div#shade-2 ul li div.career a:hover { color:#FF6600; background:url(/images/contact/2/bg-career-link-active.gif) right 3px no-repeat; } /******************************************************************************************************************* WINDOW SHADE 3 ********************************************************************************************************************/ div.contact div#shade-3 { background:url(/images/contact/3/bg-strip.jpg) right 0 no-repeat; } div.contact div#shade-3 div.hidden { background:url(/images/contact/3/bg.jpg) 0 0 no-repeat; } div.contact div#shade-3 div.black-70 { position:absolute; top:0; left:0; width:450px; height:433px; background:url(/images/contact/black-70.png); } div.contact div#shade-3 h3 { position:absolute; top:280px; right:40px; font-size:20px; padding:12px 0 0 30px; background:url(/images/contact/3/bg-h3.gif) 0 0 no-repeat; } div.contact div#shade-3 a{ position:absolute; top:325px; right:50px; padding:4px; background:#948671; color:#FFF; text-decoration:none; font-size:10px; text-transform:uppercase; } div.contact div#shade-3 a:hover { background:#000; } div.contact div#shade-3 a span { position:absolute; right:-9px; top:0; background:url(/images/contact/bg-arrow-right.png) 0 0 no-repeat; width:9px; height:20px; } div.contact div#shade-3 a:hover span { background:url(/images/contact/bg-arrow-right-active.png) 0 0 no-repeat; } div.contact div#shade-3 div.movie { position:absolute; top:20px; left:20px; width:410px; height:400px; background-color:#000000; } div.contact div#shade-3 div.movie h4 { font-size:18px; background:#000; color:#FFF; padding:5px 10px;} div.contact div#shade-3 div.movie div { width:410px; height:360px; } /******************************************************************************************************************* WINDOW SHADE 4 ********************************************************************************************************************/ div.contact div#shade-4 { background:url(/images/contact/4/bg-strip.jpg) right 0 no-repeat; } div.contact div#shade-4 div.hidden { background:url(/images/contact/4/bg.jpg) 0 0 no-repeat; } div.contact div#shade-4 div.black-70 { position:absolute; top:0; right:0; width:420px; height:433px; background:url(/images/contact/black-70.png); } div.contact div#shade-4 div.content { position:absolute; top:295px; left:30px; color:#FFF; width:220px; } div.contact div#shade-4 h3 { font-size:18px; text-transform:uppercase; } div.contact div#shade-4 p { margin:10px 0; } div.contact div#shade-4 form { position:absolute; top:20px; right:30px; width:360px; color:#FFF; } div.contact div#shade-4 table { } div.contact div#shade-4 td { padding:2px 0; vertical-align:top; } div.contact div#shade-4 label { display:block; margin:3px 15px 0 0; font-weight:bold; } div.contact div#shade-4 input.text { width:250px; border:0; background:#948671; padding:3px; color:#FFF; font-size:12px; font-family:arial; } div.contact div#shade-4 select { width:250px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.contact div#shade-4 textarea { width:250px; height:50px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.contact div#shade-4 div.submit { position:relative; margin:5px 0; } div.contact div#shade-4 div.submit input#insight { position:absolute; top:0; left:0; } div.contact div#shade-4 div.submit label#insight-label { position:absolute; top:-4px; left:20px; font-size:11px; font-weight:normal; } div.contact div#shade-4 div.submit input.submit { cursor:pointer; position:absolute; top:0; right:0px; } div.contact div#shade-4 div.mandatory { position:relative; } .LV_invalid { position:absolute; right:-23px; top:1px; width:17px; height:17px; border:1px dashed #FF6600; color:#FF6600; background:none; font-weight:bold; text-align:center; } /******************************************************************************************************************* CONTACT SUCCESS ********************************************************************************************************************/ div.contact-success { width:850px; padding:25px; background-color:#FFFFFF; } div.contact-success h1 { font:normal 26px arial; color:#ff6600; } div.contact-success a { color:#ff6600; text-decoration:none; } div.contact-success a:hover { text-decoration:underline; } div.contact-success p { color:#6c6253; margin:6px 0; line-height:16px; } /******************************************************************************************************************* IN THE WORX FORM ********************************************************************************************************************/ div.intheworx form { width:360px; color:#4c463d; margin:20px auto; } div.intheworx table { } div.intheworx td { padding:2px 0; vertical-align:top; } div.intheworx label { display:block; margin:3px 15px 0 0; font-weight:bold; } div.intheworx input.text { width:250px; border:0; background:#948671; padding:3px; color:#FFF; font-size:12px; font-family:arial; } div.intheworx select { width:250px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.intheworx textarea { width:250px; height:50px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.intheworx div.submit { position:relative; margin:5px 0; } div.intheworx div.submit input#insight { position:absolute; top:0; left:0; } div.intheworx div.submit label#insight-label { position:absolute; top:-4px; left:20px; font-size:11px; font-weight:normal; } div.intheworx div.submit input.submit { cursor:pointer; position:absolute; top:0; right:0px; } div.intheworx div.mandatory { position:relative; } /******************************************************************************************************************* CMS ITEMS ********************************************************************************************************************/ div.cms { text-align:left; font-size:16px; color:#6c6253; line-height:19px; padding-right:15px; } div.cms h2 { color:#ff6600; text-transform:uppercase; font-weight:bold; border-bottom:1px solid #CCCCCC; padding-bottom:3px; } div.cms p { margin:6px 15px 6px 0; } div.cms strong { font-weight:bold; } div.cms em { font-style:italic; } div.cms u { text-decoration:underlne; } div.cms ul { color:#4c463d; margin:6px 0 6px 20px; line-height:16px; list-style-type:disc; } div.cms ol { color:#4c463d; margin:6px 0 6px 20px; line-height:16px; list-style-type:decimal; } table tr td.main a { color:#FF6600; text-decoration:none; font:normal 12px arial; } div.cms a:hover { color:#000; } div.cms a { color:#FF6600; text-decoration:none; font:bold 14px arial; } div.cms a:hover { color:#000; } div.cms table.popup-columns { } div.cms table.popup-columns td { vertical-align:top; padding-right:10px; } /******************************************************************************************************************* POPUP ********************************************************************************************************************/ div.popup h1 { font:normal 26px arial; color:#ff6600; } div.popup p { color:#5a5143; font:normal 13px arial; margin:12px 0; line-height:1.3em; } div.popup a.arrow { background:#FFF; cursor:pointer; color:#FF6600; text-decoration:none; font-weight:bold; font-size:11px; text-transform:uppercase; padding:0 13px 0 0; background:url(/images/bg-right.gif) right 1px no-repeat; } div.popup a.arrow:hover { color:#000; } /******************************************************************************************************************* 5 THINGS ********************************************************************************************************************/ div.five-things { background-color:#FFFFFF; height:420px; position:relative; } div.rsvp { background-color:#FFFFFF; height:420px; position:relative; } div.five-things div.rsvp-img { position:absolute; top:38px; right:0px; width:301px; background:url(/images/bg-5things.jpg) repeat-y 0 0; padding:0px 0 0 0; height:412px; } div.five-things div.andrea { position:absolute; top:38px; right:0px; width:301px; background:url(/images/bg-5things.jpg) repeat-y 0 0; padding:0px 0 0 0; height:382px; } div.five-things div.andrea img { position:absolute; bottom:0px; right:0px; } div.five-things div.andrea h2 { font-size:14px; color:#333333; margin:18px 14px 4px; font-weight:bold; } div.five-things div.andrea p { margin:4px 16px 0px; width:275px; color:#333333; } div.five-things h1 { background:#ff6600; color:#FFF; font-size:20px; padding:7px 20px; width:860px; } div.five-things h2 { font-size:18px; color:#4c463d; margin:8px 20px; } div.rsvp h2 { font-size:22px; color:#000000; margin:8px 20px; } div.five-things p { color:#6c6253; margin:8px 20px; line-height:16px; font-size:12px; width:560px; } div.rsvp span { font-size:12px; color:#000000; } div.five-things a { color:#ff6600; } div.five-things table { margin:8px 00px 20px 20px; border:0px solid red; } div.five-things div.left { float:left;} div.five-things div.right { float:left; } div.five-things div.bottom { float:left; } div.five-things td.optin input { float:left; margin:5px 0 0 0; } div.five-things td.optin div { float:left; padding:3px 0 0 10px; width:170px; } div.five-things tr { padding:0; margin:0; } div.five-things tr td { padding:2px 0; vertical-align:top; margin:0px 0; } div.five-things label { display:block; margin:3px 15px 0 0; font-weight:bold; } div.five-things input.text { width:180px; border:0; background:#948671; padding:3px; color:#FFF; font-size:12px; font-family:arial; } div.five-things select { width:180px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.five-things textarea { width:180px; height:50px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.five-things div.submit { position:relative; margin:5px 8px; } div.five-things div.submit input.submit { cursor:pointer; position:absolute; top:0; right:0px; } div.five-things label { font-weight:normal; } div.five-things label.mandatory { font-weight:bold; } div.twitter a { text-decoration:none; color:#3B5998; } div.twitter a.tweet-link { font-weight:bold;} /******************************************************************************************************************* SUPPORT ********************************************************************************************************************/ /* div.support { background-color:#FFFFFF; height:420px; position:relative; } div.support div.support-img { position:absolute; top:38px; right:0px; width:301px; background:url('/images/worx_sign.jpg') repeat: none; padding:0px 0 0 0; height:412px; } div.support div.andrea { position:absolute; top:38px; right:0px; width:301px; background:url(/images/bg-5things.jpg) repeat-y 0 0; padding:0px 0 0 0; height:382px; } div.support div.andrea img { position:absolute; bottom:0px; right:0px; } div.support div.andrea h2 { font-size:14px; color:#333333; margin:18px 14px 4px; font-weight:bold; } div.support div.andrea p { margin:4px 16px 0px; width:275px; color:#333333; } div.support h1 { background:#ff6600; color:#FFF; font-size:20px; padding:7px 20px; width:860px; } div.support h2 { font-size:18px; color:#4c463d; margin:8px 20px; } div.support p { color:#6c6253; margin:8px 20px; line-height:16px; font-size:12px; width:560px; } div.support a { color:#ff6600; } div.support table { margin:8px 00px 20px 20px; border:0px solid red; } div.support div.left { float:left;} div.support div.right { float:left; } div.support div.bottom { float:left; } div.support td.optin input { float:left; margin:5px 0 0 0; } div.support td.optin div { float:left; padding:3px 0 0 10px; width:170px; } div.support tr { padding:0; margin:0; } div.support tr td { padding:2px 0; vertical-align:top; margin:0px 0; } div.support label { display:block; margin:3px 15px 0 0; font-weight:bold; } div.support input.text { width:180px; border:0; background:#948671; padding:3px; color:#FFF; font-size:12px; font-family:arial; } div.support select { width:180px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.support textarea { width:430px; height:108px; border:0; background:#948671; padding:4px; color:#FFF; font-size:12px; font-family:arial; } div.support div.submit input.submit { cursor:pointer; position:relative; top:5px; left:122px; } div.support label { font-weight:normal; } div.support label.mandatory { font-weight:bold; }*/ /******************************************************************************************************************* GALLERY ********************************************************************************************************************/ /* portfolio rotate */ div.gallery { z-index:8; position:relative; height:546px; width:1000px; overflow:hidden; border:10px solid #FFF; } /* rotator */ div.gallery ul.rotate { z-index:7; position:absolute; bottom:0; left:0; height:546px; } /* width needs to go onto infinity or to be calculated by javascript for the exact width of all rotations */ div.gallery ul.rotate li { position:relative; float:left; width:1000px; height:546px; } div.gallery ul.rotate li div.text { position:absolute; bottom:40px; left:0; width:1000px; padding:15px 0; font-size:15px; text-align:center; color:#FFF; background:url(/images/bg-black-80.png); } /* control */ div.gallery ul.control { position:absolute; bottom:0; left:0; z-index:9; height:546px; width:1000px; } div.gallery ul.control li { position:absolute; top:50%; margin-top:-20px; cursor:pointer; text-transform:uppercase; font-size:11px; color:#FFF; } div.gallery ul.control li.back { display:none; left:10px; text-align:left; } div.gallery ul.control li.back a { display:block; background:url(/images/arrow-back.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 4px 4px 12px; } div.gallery ul.control li.back a:hover { background:url(/images/arrow-back-active.png) 0 0 no-repeat; } div.gallery ul.control li.next { right:10px; text-align:right; } div.gallery ul.control li.next a { display:block; background:url(/images/arrow-next.png) 0 0 no-repeat; width:42px; height:14px; padding:4px 12px 4px 4px; } div.gallery ul.control li.next a:hover { background:url(/images/arrow-next-active.png) 0 0 no-repeat; } /******************************************************************************************************************* 25 YEARS ********************************************************************************************************************/ div.years_25 h1 { background:#ff6600; color:#FFF; font-size:20px; padding:7px 20px; width:860px; } div.years_25 h2 { font-size:18px; color:#4c463d; margin:6px 0; } div.years_25 p { color:#6c6253; margin:6px 0; line-height:16px; font-size:12px; } div.years_25 td.highlights { width:300px; background:#FFF; padding:20px; vertical-align:top; } div.years_25 td.highlights div.highlight-1 { padding:0 0 5px 0; border-bottom:1px solid #d4cfc6; margin:0 0 15px 0; } div.years_25 td.highlights div.highlight-1 img { width:300px; border:1px solid #CCCCCC; } div.years_25 td.highlights div.highlight-2 { float:left; width:142px; } div.years_25 td.highlights div.highlight-2 img { width:142px; border:1px solid #CCCCCC; } div.years_25 td.highlights div.highlight-3 { float:right; width:142px; } div.years_25 td.highlights div.highlight-3 img { width:142px; border:1px solid #CCCCCC; } div.years_25 a.plus { color:#FF6600; text-decoration:none; font-weight:bold; padding:5px; position:relative; left:-3px; top:1px; font-size:16px; } div.years_25 a.plus:hover { color:#000; } div.years_25 td.highlights div.signup { width:300px; padding:15px 0 0 0; border-top:1px solid #d4cfc6; margin:15px 0; } div.years_25 td.highlights div.signup h3 { width:194px; height:26px; background:url(/images/news/bg-inner-worx.gif) 0 0 no-repeat; } div.years_25 td.highlights div.signup h3 span { display:none; } div.years_25 td.highlights div.signup p { margin:10px 0; } div.years_25 td.highlights div.signup a { padding:4px 16px 4px 4px; background:#948671 url(/images/news/bg-in-the-worx-a.gif) right 0 no-repeat; color:#FFF; text-decoration:none; font-size:10px; text-transform:uppercase; } div.years_25 td.highlights div.signup a:hover { background:#000 url(/images/news/bg-in-the-worx-a-active.gif) right 0 no-repeat; } div.years_25 td.spacer { width:10px; } div.years_25 td.main { width:490px; background:#FFF; padding:20px 30px; vertical-align:top; } div.years_25 td.main div.highlight { position:relative; padding:0 0 10px 0; border-bottom:1px solid #d4cfc6; margin:0 0 15px 0; background:#FFF; } div.years_25 td.main div.highlight img { border:1px solid #CCCCCC; } div.years_25 td.main div.last { border-bottom:0; } div.years_25 td.main div.highlight img { float:left; width:90px; margin:4px 15px 10px 0; } div.years_25 td.main div.highlight div.content { float:right; width:380px; } div.years_25 td.main div.highlight div.content h2 { margin:0; } div.years_25 td.main div.highlight div.full { display:none; } div.years_25 td.main p.disclaimer { border-bottom:0; } div.years_25 a.open { background:#FFF; cursor:pointer; color:#FF6600; text-decoration:none; font-weight:bold; font-size:11px; text-transform:uppercase; padding:0 13px 0 0; background:url(/images/news/bg-open.gif) right 3px no-repeat; } div.years_25 a.open:hover { color:#000; } div.years_25 a.close { display:none; background:#FFF; cursor:pointer; color:#FF6600; text-decoration:none; font-weight:bold; font-size:11px; text-transform:uppercase; padding:0 13px 0 0; background:url(/images/news/bg-close.gif) right 4px no-repeat; } div.years_25 a.close:hover { color:#000; } /******************************************************************************************************************* SUPPORT PORTAL ********************************************************************************************************************/ div.support div#support_left {border-right-style: solid; border-right-width:10px; border-right-color:#d3d3d3; margin:0px 0 0 0; padding:0px; width:255px;height:497px; float: left;} div.support div#support_left div#support_left_inner {padding: 10px 15px 0 15px;} div.support h1 { background:#ff6600; color:#FFF; font-size:20px; padding:7px 20px; width:860px; } div.support h1 img{ height:25px; width:25px; padding:0px; margin:0 0 -5px 0; position: relative;} div.support h2 {color:#ff6600; font-size:18px; width:250px; padding:0 0 10px 0; margin:0px; } div.support hr {margin:8px 0; padding:0px;} div.support p{font-size:11px; font-family: arial, sans-serif; line-height:14px; } div.support p#pri_sup{background-image: url('/images/sup_arrow.png'); background-repeat:no-repeat; color:#ffffff; text-transform: uppercase; margin:0px; padding:4px 0 3px 3px; font-size:10px; } div.support p#pri_sup a{ color:#ffffff; text-decoration:none; } div.support p#pri_sup a:hover{ color:#000000; text-decoration:none; }