/* If your browser made it this far, it's a winner! */ /* First, let's import our basics - you should never need to edit these, so they're in separate files */ @import 'donotedit/basereset.css'; @import 'donotedit/structure.css'; /* These are optional, and should be imported on a project-by-project basis. (Un)comment as necessary */ @import 'donotedit/grids.css'; /* Subdivides columns into a grid layout */ /*@import 'donotedit/forms.css'; */ /* Table-less forms */ /* @import 'donotedit/sifr.css'; */ /* sIFR-specific styles */ /* END optional imports */ /* END import */ /* A handy pixel to percent font conversion */ /* 10px / 77% 11px / 85% 12px / 92% 13px / 100% 14px / 107% 15px / 114% 16px / 122% 17px / 129% 18px / 136% 19px / 144% 20px / 152% 21px / 159% 22px / 167% 23px / 174% 24px / 182% 25px / 189% 26px / 197% */ /* +++ VERY IMPORTANT+++ The default font for these templates is 13px Arial, set on the element (in basereset.css). NEVER set a font-size or font-family on the element. ALWAYS override using a child of , with the pixel-equivalent percentage value for the font size, as documented above. EG: #wrap {font-family:Verdana,Arial,Helvetica,sans-serif;} would set everything within #wrap to Verdana. It is better to set font-sizes on elements rather than containers. */ /* General fonts, sets general styles for the Cooper website */ #pagewrap, #ftwrap {font-family:Arial, Helvetica, sans-serif;} h1 {font-size:152%;} h2 {font-size:122%;} h3 {font-size:107%;} h4 {font-size:107%;} h5 {font-size:107%;} h6 {font-size:107%;} p, li, dt, dd, th, td, address, blockquote, pre, input, textarea, select {font-size:85%;} p p, p li, p dt, p dd, p th, p td, p address, p blockquote, p pre, p input, p textarea, p select, li p, li li, li dt, li dd, li th, li td, li address, li blockquote, li pre, li input, li textarea, li select, dt p, dt li, dt dt, dt dd, dt th, dt td, dt address, dt blockquote, dt pre, dt input, dt textarea, dt select, dd p, dd li, dd dt, dd dd, dd th, dd td, dd address, dd blockquote, dd pre, dd input, dd textarea, dd select, th p, th li, th dt, th dd, th th, th td, th address, th blockquote, th pre, th input, th textarea, th select, td p, td li, td dt, td dd, td th, td td, td address, td blockquote, td pre, td input, td textarea, td select, address p, address li, address dt, address dd, address th, address td, address address, address blockquote, address pre, address input, address textarea, address select, blockquote p, blockquote li, blockquote dt, blockquote dd, blockquote th, blockquote td, blockquote address, blockquote blockquote, blockquote pre, blockquote input, blockquote textarea, blockquote select, pre p, pre li, pre dt, pre dd, pre th, pre td, pre address, pre blockquote, pre pre, pre input, pre textarea, pre select, input p, input li, input dt, input dd, input th, input td, input address, input blockquote, input pre, input input, input textarea, input select, textarea p, textarea li, textarea dt, textarea dd, textarea th, textarea td, textarea address, textarea blockquote, textarea pre, textarea input, textarea textarea, textarea select, select p, select li, select dt, select dd, select th, select td, select address, select blockquote, select pre, select input, select textarea, select select {font-size:100%;} strong,b {font-weight:bold;} em,i {font-style:italic;} /* END General fonts */ /* Widths/Heights */ #pagewrap, #ftwrap { /* overall page width, centers page */ width:901px; margin:0 auto; /* centers page */ } .shortestpage { /* This height can fluctuate based on the page content and its spacing from the footer, not a required style but needed for strategic sourcing */ margin-bottom: 250px; } .shortpage { /* This height can fluctuate based on the page content and its spacing from the footer, not a required style */ margin-bottom: 50px; } body#twocol-left #pagewrap { /* Adds a 1px bottom border to the pages seperating content from the footer */ border-bottom: 1px solid #e1e1e1; padding-bottom: 20px; } /* The widths of the sec and ter columns set the width for the pri area by subtracting that width from the overall page width */ /* On pages that call the left column, the pri column is 178px - 901px = 723px, you also have to take into consideration any padding/margins associated with those columns */ #outer { padding-left:178px; /* width of left column */ padding-right:182px; /* width of right column */ } #sec { margin-left:-178px; /* same as #outer padding-left */ width:178px; /* same as #outer padding-left */ } #ter { margin-right:-182px; /* same as #outer padding-right */ width:182px; /* same as #outer padding-right */ } #ftwrap { clear: both; } /* 100% page height #ftwrap {margin-top:-25px;} *//* Negative of total height of all fts */ /*#outer {padding-bottom:25px;} END 100% page height */ /*.pad {padding:10px;} */ /* column padding */ /* END Widths/Heights */ /* If ever a background image is needed in the future of the website, you would use these to style the full page background */ /* Visual Column Structure */ body#threecol #pagewrap {background:url(../images/bg_pagewrap_threecol.gif) repeat-y top left;} body#twocol-left #pagewrap {background:url(../images/bg_pagewrap_twocol-left.gif) repeat-y top left;} body#twocol-right #pagewrap {background:url(../images/bg_pagewrap_twocol-right.gif) repeat-y top left;} body#onecol #pagewrap {background:url(../images/bg_pagewrap_onecol.gif) repeat-y top left;} /* END Visual Column Structure */ /* Theme */ html, body { /* This is the red top border that tiles across the body background of the page */ background:url(../images/body_wrap.gif) repeat-x top left; color:#3b3b3b; } td, th {vertical-align:top;} /* Generic style for any tabular data used */ p , ul { /* Adds bottom spacing to the paragraphs and unordered lists */ padding-bottom: 15px; } h2 { /* styles for the h2 headers */ padding-bottom: 10px; /* Adds bottom padding to the header */ font-size: 100%; /* Sets the size */ font-weight: bold; /* Bolds the header */ } a { /* style for links */ color: #0054a6; /* sets the color */ text-decoration:none; /* removes the underline from the link */ } a:hover { /* adds the underline for the link when you hover over it */ text-decoration: underline; } #pri .pad ul { /* Adds the style for an unordered list that falls in the main content area */ list-style-type:circle; list-style-position:inside; } .bold { /* Generic bold style */ font-weight: bold; } .intro { /* any elements with the class of 'intro' will have a white background and 10px padding all around it */ background:#fff; padding:10px; } #masthead { /* sets the font color within the masthead */ color:#3b3b3b; } #logo a { /* sets the styles for the logo area */ /*float:left;*/ display:block; background: url(../images/logo.jpg) no-repeat 0 6px scroll; /* pulls the logo as a background image */ height: 81px; /* sets the height and width so the proper area will be clickable */ width: 213px; text-indent:-9999px; /* pushes the text off the page so that it is not visible but still readable by screen readers */ } #header { /* holds all the global navigation, navigation and search */ /*float:left;*/ width:688px; position:absolute; top:5px; left:213px; /* Positions the header within the masthead */ } #header #submit { /* Styles for the submit button */ padding-left:5px; position:relative; top:5px; } #header ul.globalnav { /* styles for the global navigation links unordered list */ float: left; padding:15px 0px 19px 150px; } #header ul.globalnav li { /* styles for the global navigation links list items */ display: block; float: left; border-right: 1px solid #b71234; padding:0px 5px; } #header ul.globalnav li.last { /* removes the border from the last link in the global navigation list */ border-right: none; } #header ul.globalnav li a { /* sets the color for the global navigation links */ color: #3b3b3b; } #header p { /* sets the styles for paragraph tag within the header */ float:right; padding-top: 7px; } /* Navigation styles */ #nav { /* sets the main navigation width and position */ width:688px; float:left; } #nav ul { /* sets the background static image for the navigation */ padding: 0; height: 28px; z-index: 1001; background: url(../images/bg-nav.gif) no-repeat 0 0; margin: 0 ; } #header #nav ul li { /* positions the list items of the navigation */ float:left; padding-bottom:0; } #nav a { /* sets the styles for the navigation links */ outline: none; display:block; text-transform:uppercase; text-indent: -9999px; height: 28px; padding-bottom:0; background: url(../images/bg-nav.gif) no-repeat 0 0; } /* sets the link areas clickable in the correct areas for each nav item */ #navcompany a { /* company item specific */ width: 90px; background-position: 0 0; } #navdivisions a { /* divisions item specific */ width: 90px; background-position: -90px 0; } #navproducts a { /* products item specific */ width: 93px; background-position: -180px 0; } #navmarkets a { /* markets item specific */ width: 87px; background-position: -273px 0; } #navservice a { /* customer services item specific */ width: 150px; background-position: -360px 0; } #navinvestors a { /* investors item specific */ width: 94px; background-position: -510px 0; } #navcareers a { /* careers item specific */ width: 84px; background-position: -604px 0; } /* hover states for each of the navigation items */ #navcompany a:hover, body.companypage #navcompany a { /* positions the background hover and active state changes for the company nav item */ background-position: 0px -28px; } #navdivisions a:hover, body.divisionspage #navdivisions a { /* positions the background hover and active state changes for the divisions nav item */ background-position: -90px -28px; } #navproducts a:hover, body.productspage #navproducts a { /* positions the background hover and active state changes for the products nav item */ background-position: -180px -28px; } #navmarkets a:hover, body.marketspage #navmarkets a { /* positions the background hover and active state changes for the markets nav item */ background-position: -273px -28px; } #navservice a:hover, body.servicepage #navservice a { /* positions the background hover and active state changes for the customer services nav item */ background-position: -360px -28px; } #navinvestors a:hover, body.investorspage #navinvestors a { /* positions the background hover and active state changes for the investors nav item */ background-position: -510px -28px; } #navcareers a:hover, body.careerspage #navcareers a { /* positions the background hover and active state changes for the careers nav item */ background-position: -604px -28px; } #nav li ul { position:absolute; width:160px; left:-999em; height:auto; border:1px solid #3b3b3b; z-index:1002; } #nav li:hover ul, #nav li.sfhover ul {left:auto;} /* Works with script to pull hover actions for IE6 */ #nav li ul li a { /* styles for the list items under each main nav item, i.e. for the subnav under company */ border-top:1px solid #3b3b3b; text-decoration:none; background-image:none; background-color:#b71234; color:#fff; text-indent:0; height:auto; width:155px; display:block; padding:5px 0 5px 5px; } #nav li ul li a.first { /* removes the border from the top of the first list item in the subnav dropdown */ border-top:none; } #nav li ul li a:hover { /* hover states for the subnav items under the main navigation items */ display: block; background: #3b3b3b; } #nav li li a:hover { /* hover states for the subnav items under the main navigation items */ background: #b71234; color: #fff; } /*** company hover ***/ #nav :hover > a.companyhover { background: url(../images/bg-nav.gif) no-repeat 0 -28px; } /*** divisions hover ***/ #nav :hover > a.divisionshover { background: url(../images/bg-nav.gif) no-repeat -90px -28px; } /*** divisions hover ***/ #nav :hover > a.divisionshover { background: url(../images/bg-nav.gif) no-repeat -90px -28px; } /*** markets hover ***/ #nav :hover > a.marketshover { background: url(../images/bg-nav.gif) no-repeat -273px -28px; } /*** customer service hover ***/ #nav :hover > a.servicehover { background: url(../images/bg-nav.gif) no-repeat -360px -28px; } /**** Secondary page navigation styles ****/ #pagetitle { /* styles for each page title */ /*width: 160px; */ height: 66px; background: #b71234; color: #fff; /*margin-top: 1px; margin-left: 1px;*/ border: none; /*width: 161px; */ /*margin-left: 1px;*/ display: block; font-size: 122%; padding-left: 16px; vertical-align: middle; line-height: 66px; font-weight:bold; } ul#secondaryPgSecondaryNav { /*border-top: 2px solid #8a949d; height: 161px; margin-left: 1px; margin-top: 1px; width: 177px;*/ } ul#secondaryPgSecondaryNav { /*border-top: none;*/ /*margin-top: -3px;*/ } #secondaryPgSecondaryNav ul { margin:0 0 1px 0; padding:0;} /* positioning styles for the secondary navigation in the left column */ #secondaryPgSecondaryNav li { padding-bottom:1px;} /* positioning styles for the secondary navigation in the left column */ #secondaryPgSecondaryNav li a { /* styles for the secondary navigation in the left column */ /*width: 159px; min-height: 27px;*/ background: url(../images/secondaryButtonBg.gif) repeat-x 0 0; color: #3b3b3b; /*margin-top: 1px;*/ border: 1px solid #d6d6d6; display: block; padding-left: 16px; vertical-align: middle; line-height: 28px; text-transform:uppercase; } #secondaryPgSecondaryNav #secondaryPgSecondaryNavSub li a { /* styles for the secondary navigation in the left column links */ background: none; text-transform: none; border: none; color: #547990; } #secondaryPgSecondaryNav #secondaryPgSecondaryNavSub #secondaryPgSecondaryNavSub2 li a { /* styles for the secondary navigation in the left column links */ background: none; text-transform: none; border: none; color: #547990; margin-left:16px; } #secondaryPgSecondaryNav #secondaryPgSecondaryNavSub li { /* styles for the secondary navigation in the left column */ height: 22px; } #secondaryPgSecondaryNav #secondaryPgSecondaryNavSub { /* styles for the secondary navigation in the left column */ border: 1px solid #bdbcbd; /* adds the border around each item */ padding-top: 5px; /* sets the spacing around each item */ padding-bottom: 12px; /* sets the spacing around each item */ } #secondaryPgSecondaryNav li.lastSecNavButton a { /*min-height: 28px; margin-top: 1px;*/ } #secondaryPgSecondaryNav li.tallButton a { /* sets the background for items in the secondary navigation that are on 2 lines */ min-height: 34px; /* line-height: 41px; */ line-height: normal; /*margin-top: 1px;*/ padding-top: 6px; background: url(../images/secondaryButtonTallBg.gif) repeat-x 0 0; } #secondaryPgSecondaryNav li a:hover, #secondaryPgSecondaryNav li.lastSecNavButton a:hover, #secondaryPgSecondaryNav li.selectedMain a { color: #547990; background: #d6d6d6; text-decoration: none; } /* bolds the active page link */ #secondaryPgSecondaryNav li.selectedMain a, #secondaryPgSecondaryNav li.selectedSub a, #secondaryPgSecondaryNav li a:hover , #secondaryPgSecondaryNav li a:hover, body.template3 .energydemandpg #secondaryPgSecondaryNavSub li#energydemandnav a, body.template3 .safetynotipg #secondaryPgSecondaryNavSub li#safetynotifnav a, body.template3 .buyamericanpg #secondaryPgSecondaryNavSub li#buyamericannav a, body.template3 .usefulsitespg #secondaryPgSecondaryNavSub li#usefulsitesnav a, body.template3 .missionvisionpg #secondaryPgSecondaryNavSub li#missionvisionnav a,body.template3 .globalinfrapg #secondaryPgSecondaryNavSub li#globalinfranav a, body.template3 .energyeffpg #secondaryPgSecondaryNavSub li#energyeffnav a, body.marketspage .renewenergypg #secondaryPgSecondaryNavSub li#renewenergynav a, body.eurecruiting .universitypg li#euunivrelations a, body.marketspage .globalinfrapg #secondaryPgSecondaryNavSub li#globalinfranav a { font-weight: bold; } #secondaryPgSecondaryNav a.firstitem { /*margin-top:0;*/ } /* Add the following for company template*/ /* bolds the active page link */ body.template3 .environmentalpg li#envpolicynav a, body.template3 .valuespg li#valuesnav a,body.template3 .safetypg li#safetyhealthnav a,body.template3 .corppg li#corpgiving a,body.careerspage #secondaryPgSecondaryNav li#careersnav a, body.whycooperpage #secondaryPgSecondaryNav li#whycoopernav a, body.whycooperpage #secondaryPgSecondaryNav li#whycoopernav a, body.benefitspage #secondaryPgSecondaryNav li#benefitsnav a,body.careerdevspage #secondaryPgSecondaryNav li#careerdevnav a,body.currentemploypage #secondaryPgSecondaryNav li#currentemploynav a,body.searchfirmspage #secondaryPgSecondaryNav li#searchfirms a,body.environmentalpage #secondaryPgSecondaryNav li#envpolicynav a,body.valuespage #secondaryPgSecondaryNav li#valuesnav a,body.safetyhealthpage #secondaryPgSecondaryNav li#safetyhealthnav a { color: #547990; background: #d6d6d6; font-weight: bold; } /* styles for the active states on the left navigation tertiary links */ body.simpletemplate .legalpg li#legal a,body.simpletemplate .privacypg li#privacypolicy a, body.template3 .universitypg li#univrelations a,body.template3 .euuniversitypg li#euunivrelations a,body.simpletemplate .locationpg li#locations a, body.template3 .aboutpg li#aboutcooper a, body.template3 .historypg li#history a, body.template3 .stratsourcingpg li#strategicsourcing a,body.template3 .companypg li#companynav a, body.template3 .companypg li#directorsubnav a,body.marketspage .stimuluspg li#stimulus a, body.careerspage .universitypg li#univrelations a,body.oncampuspage #secondaryPgSecondaryNav li#recruitingsch a,body.marketspage .solarpg li#solar a, body.marketspage .windpg li#wind a, body.marketspage .greenpg li#green a, body.simpletemplate .sitepg li#sitemap a, body.divisionspage #secondaryPgSecondaryNav li#divisionsnav a, body.productspage #secondaryPgSecondaryNav li#productsnav a, body.companypage .companypg li#companynav a, body.marketspage .marketspg li#marketsnav a, body.careerspage #secondaryPgSecondaryNav li#careersnav a, body.marketspage .energydemandspg li#energydemandnav a, body.servicepage .memopg li#memonav a, body.servicepage .custcenterpg li#custcenternav a, body.servicepage .custservicepg li#custservicenav a { color: #547990; background: #d6d6d6; font-weight: bold; } /* hides the tertiary nav on pages other than the relevant ones */ #greensubnav, #stimulussubnav, #stratsourcesubnav ,#corpsubnav, #companysubnav{ display:none; } /* positions the tertiary nav */ body.marketspage .greenpg #greensubnav, body.oncampuspage .universitypg #univsubnav,body.marketspage .stimuluspg #stimulussubnav, body.marketspage .safetynotipg #stimulussubnav, body.marketspage .globalinfrapg #stimulussubnav, body.marketspage .buyamericanpg #stimulussubnav, body.marketspage .usefulsitespg #stimulussubnav, body.companypage .missionvisionpg #strategicsubnav,body.marketspage .energydemandpg #greensubnav, body.marketspage .energyeffpg #greensubnav, body.marketspage .renewenergypg #greensubnav, body.companypage .companypg #companysubnav, body.companypage .corppg #corpsubnav, body.companypage .stratsourcingpg #stratsourcesubnav/*, body.divisionspage .stimuluspg #divisionsnav*/ { display: inline; } #sec2HeaderImage { /* adds the bottom border under the main header image on the sub pages */ /*margin-top: 1px; margin-left: 1px;*/ padding-bottom: 1px; border-bottom: 2px solid #8c949f; display:block; } .template3 #pri .pad { /* adds padding for the main content area on template3 */ padding: 20px; padding-top: 10px; } /* END Navigation styles */ /* Homepage styles */ #flashpiece { /* styles associated with the flash piece */ background:#fff; color:#3b3b3b; /*padding-left:1px;*/ height: 283px; /*margin: 0; margin-top: 1px; margin-bottom: 0; margin-left: 1px; */ margin-left: 1px; } .grid-3 { /* sets the height for the 3 grid layout on the homepage */ padding:0px; margin-top: 1px; /*height: 200px;*/ background: url(../images/homepage-grid-bg.gif) #f9f9f9 no-repeat 1px 0; border-bottom: 1px solid #e1e1e1; padding-top:26px; } .grid-3 a { /* sets the link color for the 3 grid layout on the homepage */ color: #3d3d3d; } .grid-3 a .homenewsdate { /* sets the color for the news date on the homepage */ color: #0054a6; } .grid-3 #col1 { /* positions the first column in the 3 grid layout, also puts the hat, background image and border */ float:left; /*background:#fff url(../images/hard_hat.jpg) top left no-repeat;*/ width:362px; /*height: 200px;*/ } .grid-3 #col2 { /* positions the second column in the 3 grid layout, also puts the background image and border */ float:left; /*background:#fff url(../images/news.jpg) left 1px no-repeat;*/ width:361px; /*height: 200px;*/ border-left: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; } .grid-3 #col3 { /* positions the third column in the 3 grid layout, also puts the background image and border */ float:left; width:160px; /*background:url(../images/col3.jpg) left 1px no-repeat;*/ /*height: 200px;*/ } .grid-3 #col3 { /* puts the needed padding on the third column in the 3 grid layout */ padding: 0px 0 0 15px; } .grid-3 .pad2 h2 { /*positions the header on the third column in the 3 grid layout */ position:relative; top:32px; left:20px; } .grid-3 #col1 .gridcontent { /* sets the width for the second column in the 3 grid layout */ padding-left: 18px; } .grid-3 #col1 .gridcontent .contenttop { /* sets the width for the second column in the 3 grid layout */ background: url(../images/homepage-economic-recovery.jpg) no-repeat; padding-left: 70px; border-bottom: 1px solid #e1e1e1; width: 250px; } .grid-3 #col1 .gridcontent .contentbtm { /* sets the width for the second column in the 3 grid layout */ background: url(../images/homepage-hard-hats.jpg) no-repeat right 20px; width: 320px; } .grid-3 #col1 .gridcontent .contentbtm p { padding-top: 15px; width: 220px; } .grid-3 #col2 .gridcontent { /* sets the width for the second column in the 3 grid layout */ width: 320px; } .grid-3 #col2 .gridcontent p { /* sets the paragraph spacing for the seond column in the 3 grid layout */ padding-bottom: 5px; } .grid-3 ul li { /* puts the arrow in each listed link and styles them in the 3 grid layout */ list-style-type:none; background: url(../images/arrow.jpg) top left no-repeat; padding-left: 18px; color: #0054a6; text-decoration:none; padding-bottom: 10px; } .grid-3 #col2 .gridcontent ul { /* adds spacing to the news links in the 3 grid layout */ padding-top: 10px; } .grid-3 .gridcontent li a { /* sets the color for the links on the 3 grid layout */ color: #0054a6; } .grid-3 #col2 .gridcontent { /* adds the spacing needed for the second column in the 3 grid layout */ padding:0px 20px 10px 20px; } .grid-3 #col3 ul { /* adds spacing to the list in the third column of the 3 grid layout on the homepage */ padding-bottom: 5px; } .webcasts { /* Webcast style on the 3rd column of the homepage */ padding: 10px 0px 10px 20px; border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; margin-right:10px; margin-bottom: 10px; background: url(../images/icon_webcasts.jpg) no-repeat 0 5px; } .webcasts a { /* Turns webcast text blue on the 3rd column of the homepage */ color: #0054a6; } /* END Homepage styles */ /* Secondary page styles */ .grid-3 #prodsearch { /* positioning and styling of the 3 column layout on the products page */ float:left; display:block; clear: both; padding-bottom: 10px; } #secContentImage { /*margin-left: 1px;*/ border-top: 1px solid #fff; margin-bottom: 0; padding-bottom: 0; } body.simpletemplate #pri { background: url(../images/mark-header.gif) no-repeat 0 0 scroll; } .toppad10 { /*padding-top:10px;*/ } .toppad5 { /*padding-top:5px;*/ } body.simpletemplate #pri .pad { /* padding for the main content area in the simple template */ padding: 62px 0 10px 20px; padding-bottom: 0; } body.template2 #pri .pad, .toppad10 { /* padding for the main content area in template2 */ padding: 10px 0 10px 20px; } body.template2 #pri .padleft20 { /*padding-left:20px; padding-top:10px;*/ } h1 { /* positioning for the h1 tag */ padding-bottom: 10px; margin-top:0; padding-top:0; line-height: normal; } #topContainer { /* adds the grey background gradient to the top container on pages such as the stimulus page */ border-bottom: 1px solid #e1e1e1; /*border-left:1px solid #fff; width: 705px;*/ background: url(../images/oneCooperBgGradient.gif) repeat-x 0 0 scroll #f9f9f9; margin-left: 1px; /*margin-top: -10px;*/ padding-top: 15px; } #topContainer h1, #topContainer p { padding-left:8px;} /* spacing for the content within the top container */ #oneCooper { /* specific styles for pages like the stimulus page to position content better */ width: 454px; margin-right: 67px; } #companyCorp { width: 404px; margin-right: 67px; padding-left: 20px; } #recoveryGov2 { width: 150px; text-align: left; padding-right: 0px; } #twoCooper { padding-left: 20px; } #recoveryGov { width: 150px; text-align: center; padding-right: 0px; } #bottomContainer { /* adds spacing to the content below the top container */ padding-top: 20px; /*width: 705px;*/ } body.productspage #bottomContainer { /* adds spacing to the content below the top container specifically on the products page */ padding: 20px 0 0 150px; } .leftcol { /* used on situations when there is a need for 2 columns of listed items */ float:left; width: 250px; } .rightcol { /* used on situations when there is a need for 2 columns of listed items */ float:left; width: 250px; } .centertext, .centertextcorp { padding-left: 150px; } .grid3 .col { float:left; width:33%;} .productspage #topContainer { margin-bottom:20px} /* top container spacing specific to the products page */ .productspage .grid3 { padding:0 0 20px 20px;} /* 3 column layout spacing specific to the products page */ .links li { /* spacing for listed links with this class */ /*background: url(/images/linkSymbol.gif) no-repeat top left; display: block;*/ padding: 2px 0 2px 0px; } .productspage .grid3 .links li { /* styles for listed links specifically on the products page, adds the bullets */ list-style-type: circle; list-style-position:inside; } body.worldwidecorp #topContainer { margin-bottom:20px; } #bottomSubContainer3 { width: 507px; padding-right: 33px; border-right: 1px solid #e1e1e1; } .bottomSubContainer1 { width: 220px; } #energyEfficiency, #globalInfrastructure { padding-right: 65px; padding-left: 20px; width: 200px; } .bottomSubContainer1, .bottomSubContainer2, #bottomSubContainer3, #bottomContainer, /*#topContainer,*/ #oneCooper, #recoveryGov { float: left; } .bottomSubContainer4 .bottomSubContainer1 { padding-left: 20px; } .bottomSubContainer4 .nopad { padding-left: 0px; } body.marketspage .bottomSubContainer4 { height: 270px; } #bottomContainer { clear: both; } #sidebar { /* text on the sidebar of main content, example usage on the stimulus page */ width: 140px; float: left; padding:0 4px 0 6px; } #sidebar h3 { /* header style for the sidebar of main content */ font-size: 92%; font-weight: bold; } .simpletemplate #nav { /*margin-left: -1px;*/ } .template2 #header p, .template3 #header p { /*margin-right: -1px;*/ } .template3 #pri .grid-2 .pad { /* re-sets padding for the main content area in template3 */ padding-left: 0; } .marketspage .grid-2 h2 { /* header styles for the markets page 2 grid layout */ background: #d6d6d6; padding-top:5px; padding-left: 10px; padding-bottom: 5px; height: 16px; } /*Added the following on 01/19/2010*/ .marketspage .grid-2 h2#solar { /* header styles for the markets page 2 grid layout */ background: #ffffff; padding-top:5px; padding-left: 2px; padding-bottom: 5px; height: 16px; } /*End of code on 01/19/2010*/ .marketspage .grid-2 h2#residential { background: url(../images/icon-residential.jpg) #d6d6d6 no-repeat top right; } .marketspage .grid-2 h2#commercial { background: url(../images/icon-commercial.jpg) #d6d6d6 no-repeat top right; } .marketspage .grid-2 h2#utility { background: url(../images/icon-utility.jpg) #d6d6d6 no-repeat top right; } .marketspage .grid-2 h2#manufacturing { background: url(../images/icon-manufacturing.jpg) #d6d6d6 no-repeat top right; } .marketspage .grid-2 p { padding-top:10px; } /*Addition for company page*/ .companypage .grid-2 h2 { background: #d6d6d6; padding-top:5px; padding-left: 10px; padding-bottom: 5px; height: 16px; } /* icon/header styles specifically for the solar markets page */ .companypage .grid-2 h2#residential { background: url(../images/icon-residential.jpg) #d6d6d6 no-repeat top right; } .companypage .grid-2 h2#commercial { background: url(../images/icon-commercial.jpg) #d6d6d6 no-repeat top right; } .companypage .grid-2 h2#utility { background: url(../images/icon-utility.jpg) #d6d6d6 no-repeat top right; } .companypage .grid-2 h2#manufacturing { background: url(../images/icon-manufacturing.jpg) #d6d6d6 no-repeat top right; } .companypage .grid-2 p { padding-top:10px; } body.productspage #pri .pad .grid3 ul.links li#bullets { /* bullet styles for the products page 3 column layout */ list-style-type: circle; list-style-position:inside; } /* END Secondary page styles */ /* Footer styles */ #ft { /* main wrapper for the footer, adds the styles and spacing for it */ background:#fff; color:#3b3b3b; /*width: 901px;*/ margin: 0 auto; font-size:85%; padding-top: 10px; } #ft p {padding:0; float:right;} /* positions the paragraphs within the footer */ #ftlinks { /* positions the footer links */ float:left; } #ft ul { /* adds spacing to the unordered list in the footer */ padding-bottom: 5px; } #ft li {display:inline;} /* displays the links in a line in the footer */ #ft li a { /* positioning and styles for the listed linked items in the footer */ display:block; float:left; border-right:1px solid #3b3b3b; margin-right:7px; padding-right:7px; color:#3b3b3b; text-decoration:none; } #ft li a:hover {text-decoration:underline;} /* adds the underline on links in the hover state in the footer */ #ft li.last a { /* removes the border from the last linked item in the footer */ border-right:0; margin-right:0; padding-right:0; } /* END Theme */ .more { background: url(/images/linkSymbol.gif) no-repeat top left; font-size: 85%; height: 13px; padding: 1px 0 0 16px; } .stockmore { background: url(/images/linkSymbol.gif) no-repeat top left; font-size: 85%; height: 13px; padding: 1px 0 0 18px; } /* General Forms styles */ .form-1 fieldset, .form-2 fieldset { border:1px solid #ccc; } .form-1 label { width:80px; font-size:85%; } .form-1 fieldset fieldset label { width:79px; } .form-1 input { width:120px; font-size:85%; } .form-1 textarea, .form-2 textarea { width:420px; font-size:85%; } .form-1 legend, .form-1 select, .form-1 a, .form-1 p { font-size:85%; } .form-1 p input { font-size:100%; } .grid-3 select { width: 120px; float:left; margin-right: 5px; } .grid-3 input.button { float:left; } /* END Forms */ .more { background: url(/images/linkSymbol.gif) no-repeat top left; display: block; font-size: 85%; height: 13px; margin-bottom: 15px; padding: 1px 0 0 17px; } /* BOXES */ .divisionspage .box { border-bottom:1px solid #d8d8d8; margin-bottom:20px; } .divisionspage .last { border-bottom:0 solid #d8d8d8; margin-bottom:0;} .divisionspage .box h3 { float:left;} .divisionspage .box p { margin-left:228px;} /* BOXES */ /* START Gateway page styles */ body.gatepage #logo { float:left; } body.gatepage #logo a { /* sets the styles for the logo area */ display:block; background: url(../images/logo.jpg) no-repeat 0 4px scroll; /* pulls the logo as a background image */ height: 80px; /* sets the height and width so the proper area will be clickable */ width: 213px; text-indent:-9999px; /* pushes the text off the page so that it is not visible but still readable by screen readers */ } #gatewaylogo { /* positions the cooper gateway logo on the top right */ width: 188px; float:right; height: 77px; margin-top: 4px; } /* Gateway page navigation styles */ body.gatepage #gatenav { /* styles the border and position of the gateway nav */ border-top: 4px solid #8996a0; background: url(../images/gateway_nav_bg.gif) repeat-x; height:37px; width: 901px; float:left; } body.gatepage #gatenav ul { /* sets the background static image for the navigation */ padding: 0; height: 35px; margin: 0; border-left: 1px solid #b3b3b3; margin-top:1px; float:left; background: url(../images/gateway_nav.jpg) no-repeat; width: 629px; } body.gatepage #gatenav ul li { /* positions the list items of the navigation */ float:left; padding-bottom:0; } body.gatepage #gatenav a { /* adds the navigation as a background image */ background: url(../images/gateway_nav.jpg) no-repeat; } #gatenav li a { /* Styles the navigation list items */ color: #32363f; float:left; /*border-right: 1px solid #b3b3b3;*/ border-bottom: 1px solid #b3b3b3; height:35px; text-indent:-9999px; } #gatenav li a:hover { /* sets the height for the hover states of the gateway nav */ height: 35px; } #gatenav #industries a { /* positions the Cooper Industries nav button */ width: 187px; background-position: 0 0; } #gatenav #login a { /* positions the Login nav button */ width: 119px; background-position: -187px 0; } #gatenav #inside a { /* positions the Inside Cooper nav button */ width: 151px; background-position: -306px 0; } #gatenav #service a { /* positions the EBS service nav button */ width: 171px; background-position: -457px 0; } #gatenav #industries a:hover { /* positions the hover state on the Cooper Industries nav button */ background-position: 0 -35px; } #gatenav #login a:hover { /* positions the hover state on the Login nav button */ background-position: -187px -35px; } #gatenav #inside a:hover { /* positions the hover state on the Inside Cooper nav button */ background-position: -306px -35px; } #gatenav #service a:hover { /* positions the hover state on the EBS service nav button */ background-position: -457px -35px; } .rtborder { /* Adds the grey right border at the end of the gateway page nav */ border-right: 1px solid #b3b3b3; } #gatenav #stock { /* stock ticker in navigation */ float:left; border-right: 1px solid #b3b3b3; width: 260px; height: 27px; font-size: 92%; padding-top: 10px; /*padding-left:50px;*/ padding-right: 10px; text-align:right; } body.gatepage #pri #gateheader { /* Gateway page banner image spacing */ display:block; margin-bottom:1px; height: 242px; } body.gatepage #pri #gateheader img { float:left; } body.gatepage #headercontent { float:left; width:227px; background: url(../images/gateway_header_text_bg.gif) repeat-x; padding: 20px 20px 0 24px; height: 222px; } body.gatepage #headercontent h2 { color: #b71234; font-size: 20px; } body.gatepage #headercontent #h2big { color: #b71234; font-size: 30px; } body.gatepage #headercontent p { line-height: 1.4em; border-top: dotted; padding-top:10px; font-size: 12px; } body.gatepage .grid-2 { /* 2 column grid style */ background: url(../images/gateway_grid_bg.gif) repeat-x; border-bottom: 1px solid #e1e1e1; width: 901px; } body.gatepage .grid-2 .col { /* floats the 2 column grids left */ float:left; } body.gatepage .grid-2 #col1 { /* 1st column structure styles */ background: url(../images/gateway_col1_bg.gif) no-repeat; float:left; width: 450px; } body.gatepage .grid-2 #col2 { /* 2nd column structure */ background: url(../images/gateway_col2_bg.gif) no-repeat; float:left; } body.gatepage #col1 .gridcontent { /* 1st column content positioning */ border-right: 1px solid #e1e1e1; padding-left:20px; margin-top:30px; } body.gatepage #col2 .gridcontent { /* 2nd column content positioning */ padding-top: 30px; padding-left:20px; } body.gatepage .col h2 { /* sets the size for the titles of the columns */ font-size: 136%; } body.gatepage #col1 p { /* 1st column content positioning */ width: 370px; border-bottom: 1px solid #e1e1e1; padding-bottom: 10px; margin-bottom: 10px; } body.gatepage #col2 p { /* 2nd column content positioning */ width: 400px; border-bottom: 1px solid #e1e1e1; padding-bottom: 10px; margin-bottom: 10px; } body.gatepage #col1 p a, body.gatepage #col2 p a { /* colors linked text in grid dark grey */ color: #3b3b3b; } .date { /* styles the date to be blue */ color: #0054a6; } body.gatepage #col1 p.last, body.gatepage #col2 p.last { /* removes bottom border from the last news item */ border-bottom: none; } /* END Gateway page styles */ /* Clearfix */ .clearfix:after, #topContainer:after, #header:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } /* END Clearfix */