body { margin: 0 0 20px 0; background: url(../_imgs/bkgdGrad.jpg) repeat-x #FFF; font-family: Arial, "Lucida Grande", Verdana, Helvetica, sans-serif; } /******************************************************************************** wraps ********************************************************************************/ #shadowWrap { width: 990px; height: 400px; margin: 0 auto; padding: 0; background: url(../_imgs/headerSideShadow.jpg) no-repeat; } #mainWrap { width: 960px; margin: 0 auto; padding: 0; background: #FFF; } /******************************************************************************** header ********************************************************************************/ #header { float: left; width: 960px; height: 106px; background: url(../_imgs/headerBkgd.gif) repeat-x #FFF; margin: 0; padding: 0; } #header #main { float: left; width: 960px; height: 75px; } /* * nav */ #header #menu { width: 960px; height: 30px; list-style: none; font-size: 10px; margin: 0; padding: 0; } #header #menu li { height: 30px; padding: 0; margin: 0; padding: 0 15px 0 15px; background: url(../_imgs/navLine.gif) repeat-x; } #header #menu li.left { background: url(../_imgs/navDivide.gif) no-repeat right top; } #header #menu li.right { background: url(../_imgs/navDivide.gif) no-repeat left top; } #header #menu li.selected { background: #3d715e url(../_imgs/navHighlight.gif) no-repeat center bottom; } #header #menu li.selected a, #header #menu li.selected a:hover { color: #ffd600; } #header #menu li a { color: #FFF; text-decoration: none; padding: 8px 0 0 0; float: left; } #header #menu li a:hover { color: #ffd600; } /*#logo { float: left; width: 210px; height: 75px; background: url(../_imgs/logo.gif) no-repeat; position: relative; left: 20px; top: 0; }*/ #logo { float: left; width: 210px; height: 40px; background: url(../_imgs/newlogo1.gif) no-repeat; position: relative; left: 20px; top: 20px; } #strapline { float: left; width: 400px; height: 75px; } #search { float: right; width: 284px; height: 37px; background: url(../_imgs/search.gif) no-repeat; position: relative; right: 0; top: 0; } #search p { margin: 3px 0 0 40px; padding: 0 10px 0 0; color: #FFF; font-size: 10px; float: right; } #search input { width: 135px; height: 15px; border: none; background: #FFF; margin: 0 5px 0 5px; font-size: 10px; padding: 2px 0 0 2px; } #flags { float: right; width: 264px; height: 37px; position: relative; right: 20px; } #flags img { float: right; margin: 0 5px 0 0; } #home #headerShadow { float: left; width: 960px; height: 16px; background: url(../_imgs/headerShadow.gif) no-repeat center bottom; } #headerShadow { float: left; width: 960px; height: 16px; background: url(../_imgs/headerShadow2.gif) no-repeat center bottom; } /******************************************************************************** flash header ********************************************************************************/ #flashHeader { width: 960px; height: 220px; background: #5a7725; float: left; margin: 0; padding: 0; } /******************************************************************************** picture headers ********************************************************************************/ #picHeader { width: 960px; height: 150px; background: #EEE; float: left; margin: 0; padding: 0; } #corporate #picHeader { background: url(../_imgs/bannerCorporate.jpg) no-repeat; } #heavyHaul #picHeader { background: url(../_imgs/bannerHeavyHaul.jpg) no-repeat; } #heavyHaulCoal #picHeader { background: url(../_imgs/bannerCoal.jpg) no-repeat; } #careers #picHeader { background: url(../_imgs/bannerCareers.jpg) no-repeat; } #careersDetail #picHeader { background: url(../_imgs/bannerCareers.jpg) no-repeat; } #news #picHeader { background: url(../_imgs/bannerNews.jpg) no-repeat; } #newsDetail #picHeader { background: url(../_imgs/bannerNews.jpg) no-repeat; } #caseStudies #picHeader { background: url(../_imgs/bannerCaseStudies.jpg) no-repeat; } #contact #picHeader { background: url(../_imgs/bannerContact.jpg) no-repeat; } #environment #picHeader { background: url(../_imgs/bannerEnvironment.jpg) no-repeat; } #pressOffice #picHeader { background: url(../_imgs/bannerPressOffice.jpg) no-repeat; } #pressOfficeLibrary #picHeader { background: url(../_imgs/bannerPressOffice.jpg) no-repeat; } #railServices #picHeader { background: url(../_imgs/bannerRailServices.jpg) no-repeat; } #shop #picHeader { background: url(../_imgs/bannerShop.jpg) no-repeat; } /******************************************************************************** breadcrumb ********************************************************************************/ #breadcrumb { background: url(../_imgs/breadcrumbBkgd.gif) no-repeat; float: left; width: 960px; height: 30px; } #breadcrumb p { float: left; margin: 8px 0 0 0; position: relative; left: 20px; } /******************************************************************************** main content ********************************************************************************/ /* * content type 1 */ #content { float: left; width: 940px; margin-top: 10px; padding: 0; position: relative; left: 10px; } #content #leftColumn { float: left; width: 304px; } #content #middleColumn { float: left; width: 450px; } #content #rightColumn { float: left; width: 164px; } /* * content type 2 */ #content2 { float: left; width: 960px; margin-top: 10px; padding: 0; position: relative; left: 10px; } #content2 #leftColumn { float: left; width: 200px; } #content2 #middleColumn { float: left; width: 750px; } #content2 div#middleColumnSplit { float: left; width: 750px; } #content2 div#middleColumnSplitLeft { float: left; width: 350px; position: relative; left: 10px; padding: 0 0 20px 0; overflow: hidden; } #content2 div#middleColumnSplitRight { float: right; width: 360px; position: relative; right: 20px; padding: 0 0 20px 0; overflow: hidden; } /* * content type 3 */ #content3 { float: left; width: 960px; margin-top: 10px; padding: 0; position: relative; left: 10px; } #content3 #leftColumn { float: left; width: 200px; } #content3 #middleColumn { float: left; width: 560px; } #content3 #rightColumn { float: left; width: 190px; } /* * content type 3 */ #content4 { float: left; width: 960px; margin-top: 10px; padding: 0; position: relative; left: 10px; } #content4 #middleColumn { float: left; width: 745px; } #content4 #rightColumn { float: right; margin: 30px 10px 0 0; width: 180px; } /******************************************************************************** custom pages ********************************************************************************/ #environment #content { background: url(../_imgs/environmentContentBackground.jpg) no-repeat left top; } #environment #content #middleColumn {width: 530px; height:453px;} #environment #content #middleColumn .boxWrap { width: 530px; } /*#pressOffice #content2 #middleColumn { background: url(../_imgs/pressOfficeBackground.jpg) no-repeat left top; padding-top: 25px; padding-bottom: 30px; height: 601px;}*/ /*#pressOffice #content2 #middleColumn { padding-top: 25px; padding-bottom: 30px; height: 601px;}*/ #newsDetail #middleColumn h3 { color: #898989; font-size: 16px; margin: 10px 0 3px 0; } #newsDetail #middleColumn h4 { color: #326954; font-weight: normal; margin: 0 0 10px 0; } #newsDetail #middleColumn h4.alt { color: #00442b; } #railServices #content2 { background: url(../_imgs/railServicesContentBackground.jpg) no-repeat right top; } #railServices #content2 #middleColumn div.textWrap { height: 240px; } #FileNotFound #content #leftColumn {float: left; width: 190px;} #FileNotFound #content #middleColumn {float: left;width: 550px;} #FileNotFound #content #rightColumn {float: right; width: 200px;} /******************************************************************************** text component ********************************************************************************/ .textWrap { padding: 0 0 20px 0; float: left; position: relative; left: 10px; } #content2 .textWrap { width: 720px; } #content3 .textWrap { width: 540px; } #content4 .textWrap { width: 735px; } .textWrap .text1 { width: 350px; } .textWrap.underline { border-bottom: solid 1px #EEE; margin: 0 0 20px 0;} .textWrap .twoCol .colLeft { float: left; width: 345px; } .textWrap .twoCol .colRight { float: right; width: 345px; } .textWrapShadow { background: url(../_imgs/textWrapShadow.jpg) no-repeat left bottom; padding-bottom: 45px; margin-bottom: 25px; } /******************************************************************************** grey pic box components ********************************************************************************/ /*.boxWrap { float: left; width: 750px; }*/ .boxWrap { float: left; } #middleColumn .greyPicBox1 a { float: left; width: 360px; height: 170px; background: url(../_imgs/greyPicBox1.jpg) no-repeat; margin: 0 5px 0 5px; } #middleColumn .greyPicBox1 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .greyPicBox1 a img { float: left; margin: 15px; } #middleColumn .greyPicBox1 a .text { float: right; width: 180px; position: relative; right: 20px; } #middleColumn .greyPicBox1 a:hover { float: left; width: 360px; height: 170px; background: url(../_imgs/greyPicBoxHi1.jpg) no-repeat; text-decoration: none; } #middleColumn .greyPicBox1 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyPicBox1 a:hover .text h4 { color: #FFF; } #middleColumn .greyPicBox1 a:hover .text p { color: #FFF; } #middleColumn .greyPicBox2 a { float: left; width: 240px; height: 270px; background: url(../_imgs/greyPicBox2.jpg) no-repeat; margin: 0 5px 0 5px; } #middleColumn .greyPicBox2 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; color: #66660e; } #middleColumn .greyPicBox2 a img { position: relative; left: 15px; } #middleColumn .greyPicBox2 a .text { width: 220px; height: 105px; position: relative; left: 15px; margin: 10px 0 0 0; } #middleColumn .greyPicBox2 a .text h4 { margin: 0; } #middleColumn .greyPicBox2 a .text p { margin: 5px 0 0 0; } #middleColumn .greyPicBox2 a:hover { float: left; width: 240px; height: 270px; background: url(../_imgs/greyPicBoxHi2.jpg) no-repeat; text-decoration: none; } #middleColumn .greyPicBox2 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyPicBox2 a:hover .text h4 { color: #FFF; } #middleColumn .greyPicBox2 a:hover .text p { color: #FFF; } #middleColumn .greyPicBox2 a:hover .text ul li { color: #FFF; } #middleColumn .greyPicBox3 a { float: left; width: 430px; height: 170px; background: url(../_imgs/greyPicBox3.jpg) no-repeat; margin: 0 5px 0 5px; } #middleColumn .greyPicBox3 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .greyPicBox3 a img { float: left; margin: 15px; } #middleColumn .greyPicBox3 a .text { float: right; width: 245px; position: relative; right: 20px; top: 5px; } #middleColumn .greyPicBox3 a:hover { background: url(../_imgs/greyPicBoxHi3.jpg) no-repeat; text-decoration: none; } #middleColumn .greyPicBox3 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyPicBox3 a:hover .text h4 { color: #FFF; } #middleColumn .greyPicBox3 a:hover .text p { color: #FFF; } #middleColumn .greyPicBox4 a { float: left; width: 140px; height: 310px; background: url(../_imgs/greyPicBox4.jpg) no-repeat; margin: 0 5px 0 5px; position: relative; } #middleColumn .greyPicBox4 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .greyPicBox4 a img { float: left; margin: 15px; } #middleColumn .greyPicBox4 a input { float: left; margin: 15px; } #middleColumn .greyPicBox4 a .text { position: absolute; top: 135px; width: 115px; left: 15px; } #middleColumn .greyPicBox4 a .text h4 { margin: 0 0 3px 0; color: #00442b; font-size: 12px; } #middleColumn .greyPicBox4 a .text p { margin: 0; } #middleColumn .greyPicBox4 a .format { position: absolute; bottom: 35px; width: 115px; left: 15px; } #middleColumn .greyPicBox4 a .format strong { color: #847c19; } #middleColumn .greyPicBox4 a:hover { background: url(../_imgs/greyPicBoxHi4.jpg) no-repeat; text-decoration: none; } #middleColumn .greyPicBox4 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyPicBox4 a:hover .text h4 { color: #FFF; } #middleColumn .greyPicBox4 a:hover .text p { color: #FFF; } #middleColumn .greyPicBox4 a:hover .format p { color: #FFF; } #middleColumn .greyPicBox4 a:hover .format strong { color: #FFF; } #middleColumn .greyPicBox9 { float: left; width: 140px; height: 245px; margin: 0 5px 0 5px; position: relative; } #middleColumn .greyPicBox9 .background { float: left; width: 140px; height: 245px; background: url(../_imgs/greyPicBox9.jpg) no-repeat; margin: 0 5px 0 5px; position: relative; } #middleColumn .greyPicBox9 .background .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .greyPicBox9 .background img { float: left; margin: 15px; } #middleColumn .greyPicBox9 .background input { float: left; margin: 15px; } #middleColumn .greyPicBox9 .background .text { position: relative; top: 5px; width: 115px; left: 15px; } /*#middleColumn .greyPicBox9 .background .noLayout a { position: absolute; top: 5px; width: 10px; left: -50px; }*/ /*#middleColumn .greyPicBox9 div .text h4 { margin: 0 0 3px 0px; color: #00442b; font-size: 12px; }*/ #middleColumn .greyPicBox9 .background .text h4 { margin: 0 0 3px 0px; color: #00442b; font-size: 12px; } #middleColumn .greyPicBox9 .background .text p { margin: 0; } #middleColumn .greyPicBox9 .background .format { position: absolute; bottom: 35px; width: 115px; left: 15px; } #middleColumn .greyPicBox9 .background .format strong { color: #847c19; } #middleColumn .greyPicBox9 .background:hover { background: url(../_imgs/greyPicBoxHi9.jpg) no-repeat; text-decoration: none; } #middleColumn .greyPicBox9 .background:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyPicBox9 .background:hover .text h4 { color: #FFF; } #middleColumn .greyPicBox9 .background:hover .text p { color: #FFF; } #middleColumn .greyPicBox9 .background:hover .format p { color: #FFF; } #middleColumn .greyPicBox9 .background:hover .format strong { color: #FFF; } /* #middleColumn .greyPicBox9 .enlargeBit{float:left ; left:-125px; position:relative;top:150px;background-color:blue;} #middleColumn .greyPicBox9 .enlargeBit a {float: none; position:relative; left:0px; width:50px; background-color:Red;} #middleColumn .greyPicBox9 .enlargeBit p {width:50px; } */ #middleColumn .greyPicBox9 .enlargeBit{float:left;top:-90px;left:15px;margin: 0 5px 0 5px;position: relative;background-color:transparent;} #middleColumn .greyPicBox9 .enlargeBit a {background-color:transparent;} /*#middleColumn .greyPicBox9 .enlargeBit p {width:50px; }*/ /******************************************************************************** grey text box components ********************************************************************************/ #middleColumn .greyTextBox1 a { float: left; width: 240px; height: 185px; background: url(../_imgs/greyTextBox1.jpg) no-repeat; margin: 0 5px 0 5px; position: relative; } #middleColumn .greyTextBox1 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .greyTextBox1 a img { position: relative; left: 15px; } #middleColumn .greyTextBox1 a .text { width: 220px; height: 105px; position: relative; left: 15px; margin: 10px 0 0 0; } #middleColumn .greyTextBox1 a .text h4 { margin: 0 0 5px 0; color: red; } #middleColumn .greyTextBox1 a .text h5 { margin: 0; } #middleColumn .greyTextBox1 a .text p { margin: 5px 0 0 0; } #middleColumn .greyTextBox1 a .arrow { position: absolute; bottom: 30px; margin-left: 15px; color: #66660e; } #middleColumn .greyTextBox1 a:hover { float: left; width: 240px; height: 185px; background: url(../_imgs/greyTextBoxHi1.jpg) no-repeat; text-decoration: none; } #middleColumn .greyTextBox1 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .greyTextBox1 a:hover .text h4 { color: #FFF; } #middleColumn .greyTextBox1 a:hover .text h5 { color: #FFF; } #middleColumn .greyTextBox1 a:hover .text p { color: #FFF; } #middleColumn .greyTextBox1 a:hover .text ul li { color: #FFF; } /******************************************************************************** Careers grey text box components ********************************************************************************/ #middleColumn .CareersgreyTextBox1 a { float: left; width: 365px; height: 185px; background: url(../_imgs/careersgreyTextBox1.jpg) no-repeat; margin: 0 5px 0 5px; position: relative; } #middleColumn .CareersgreyTextBox1 a .arrow { background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } #middleColumn .CareersgreyTextBox1 a img { position: relative; left: 15px; } #middleColumn .CareersgreyTextBox1 a .text { width: 345px; height: 105px; position: relative; left: 15px; margin: 10px 0 0 0; } #middleColumn .CareersgreyTextBox1 a .text h4 { margin: 0 0 5px 0; color: red; } #middleColumn .CareersgreyTextBox1 a .text h5 { margin: 0; } #middleColumn .CareersgreyTextBox1 a .text p { margin: 5px 0 0 0; } #middleColumn .CareersgreyTextBox1 a .arrow { position: absolute; bottom: 30px; margin-left: 15px; color: #66660e; } #middleColumn .CareersgreyTextBox1 a:hover { float: left; width: 365px; height: 185px; background: url(../_imgs/careersgreyTextBoxHi1.jpg) no-repeat; text-decoration: none; } #middleColumn .CareersgreyTextBox1 a:hover .arrow { background: url(../_imgs/arrow.gif) no-repeat right 4px; color: #FFF; } #middleColumn .CareersgreyTextBox1 a:hover .text h4 { color: #FFF; } #middleColumn .CareersgreyTextBox1 a:hover .text h5 { color: #FFF; } #middleColumn .CareersgreyTextBox1 a:hover .text p { color: #FFF; } #middleColumn .CareersgreyTextBox1 a:hover .text ul li { color: #FFF; } /******************************************************************************** grey link box components ********************************************************************************/ #rightColumn .greyLinkBox1 { background: #f2f2f2 url(../_imgs/greyLinkBox1.jpg) no-repeat left bottom; padding: 15px 5px 30px 5px; } #rightColumn .greyLinkBox1 h4 { margin: 0 5px 10px 5px; color: #00442b; font-size: 14px; font-weight: normal; } #rightColumn .greyLinkBox1 ul { margin: 0; padding: 0; list-style: none; } #rightColumn .greyLinkBox1 li { font-size: 11px; border-top: 1px solid #d9d9d9; padding: 5px; } #rightColumn .greyLinkBox1 li.pdf { background: #f2f2f2 url(../_imgs/greyLinkBox_pdf.gif) no-repeat right top; padding: 8px 40px 8px 5px; } #rightColumn .greyLinkBox1 li a { color: #898989; } /******************************************************************************** grey form box components ********************************************************************************/ #middleColumn .greyFormBox1 { background: url(../_imgs/greyFormBox1.jpg) no-repeat left bottom; padding-bottom: 25px; } #middleColumn .greyFormBox2 { background: url(../_imgs/greyFormBox2.jpg) no-repeat left bottom; padding-bottom: 25px; } /******************************************************************************** sub menu component ********************************************************************************/ .submenu { width: 184px; list-style: none; font-size: 10px; margin: 0; padding: 0; } .submenu .top { height: 32px; background: url(../_imgs/subTop.jpg) no-repeat; } .submenu .middle { width: 184px; background: url(../_imgs/subMiddle.jpg) repeat-y; padding: 0 0 0 3px; float: left; } .submenu .bottom { height: 26px; background: url(../_imgs/subBottom.jpg) no-repeat; clear: both; } .submenu li { width: 148px; height: 20px; margin: 0; padding: 0 15px 0 15px; border-bottom: solid 1px #DDD; background: #FFF url(../_imgs/subArrow.gif) no-repeat right center; } .submenu li.selected, .submenu li.selected:hover { background: #ffa520 url(../_imgs/subArrowHi.gif) no-repeat right center; } .submenu li.selected a, .submenu li.selected a:hover { color: #FFF; } .submenu li:hover { background: #EEE url(../_imgs/subArrowOver.gif) no-repeat right center; } .submenu li a { color: #999; text-decoration: none; padding: 5px 0 0 0; float: left; } /*.submenu li a:hover { color: #5a7725; text-decoration: none; }*/ .submenu li a:hover { color: #326954; text-decoration: none; } /******************************************************************************** box components ********************************************************************************/ .box p { font-size: 10px; margin: 0; } .box h4 { font-size: 12px; margin: 0; } .box.small { width: 164px; } .box.small .top { height: 32px; background: url(../_imgs/boxSmTop.jpg) no-repeat; } .box.small .middle { width: 164px; background: url(../_imgs/boxSmMiddle.jpg) repeat-y; } .box.small .bottom { height: 36px; background: url(../_imgs/boxSmBottom.jpg) no-repeat; } .box.small2 { width: 184px; } .box.small2 .top { height: 32px; background: url(../_imgs/boxSmTop2.jpg) no-repeat; } .box.small2 .middle { width: 184px; background: url(../_imgs/boxSmMiddle2.jpg) repeat-y; } .box.small2 .bottom { height: 36px; background: url(../_imgs/boxSmBottom2.jpg) no-repeat; } .box.medium { width: 304px; } .box.medium .top { height: 32px; background: url(../_imgs/boxMedTop.jpg) no-repeat; } .box.medium .middle { width: 304px; background: url(../_imgs/boxMedMiddle.jpg) repeat-y; } .box.medium .bottom { height: 36px; background: url(../_imgs/boxMedBottom.jpg) no-repeat; } .box.large { width: 454px; } .box.large .top { height: 32px; background: url(../_imgs/boxLrgTop.jpg) no-repeat; } .box.large .middle { width: 454px; background: url(../_imgs/boxLrgMiddle.jpg) repeat-y; } .box.large .bottom { height: 36px; background: url(../_imgs/boxLrgBottom.jpg) no-repeat; } /******************************************************************************** 2 columned large box ********************************************************************************/ .box .top .col1, .submenu .top .col1 { float: left; margin: 9px 0 0 0; position: relative; left: 10px; } .box .top .col2 { float: right; margin: 9px 0 0 0; position: relative; width: 203px; } .box .middle .col1 { float: left; margin: 0; position: relative; left: 3px; width: 250px; } .box .middle .divider { border-right: solid 1px #DDD; } .box .middle .col2 { float: right; margin: 0; position: relative; width: 203px; } .box .middle { float: left; } .box .bottom { clear: both; } .box .text { margin: 15px 15px 0 15px; } /******************************************************************************** case study box ********************************************************************************/ .box .caseStudy { float: left; margin: 0; position: relative; left: 3px; width: 304px; } .box .caseStudy .pic { float: left; margin: 0; width: 120px; margin: 0; padding: 10px 0 20px 0; border-right: solid 1px #DDD; } .box .caseStudy .title { float: left; margin: 0; position: relative; width: 176px; height: 55px; background: url(../_imgs/homeCSGrad.jpg) repeat-x; } .box .caseStudy .title h3 { margin: 13px 0 0 10px; color: #999; } .box .caseStudy .title p { margin: 0 0 0 10px; } .box .caseStudy .text { float: right; margin: 0; position: relative; right: 26px; width: 145px; margin: 15px 0 0 0; } /******************************************************************************** news box ********************************************************************************/ .box .news { float: left; margin: 10px 0 0 0; padding: 0 0 10px 0; position: relative; left: 10px; width: 144px; border-bottom: solid 1px #DDD; } /******************************************************************************** paging ********************************************************************************/ div.paging { border-top: 1px solid #e5e5e5; margin: 10px; } div.paging p { color: #00442b; font-size: 12px; } div.paging p a { color: #00442b; } div.imagebox { border: 1px solid #e5e5e5; padding: 5px; float: left; margin: 0 15px 0 0; } /******************************************************************************** cross selling boxes ********************************************************************************/ #leftColumn .csbox { float: left; width: 184px; } #rightColumn .csbox { float: right; width: 184px; } .csbox img { margin: 0 0 5px 0; } /******************************************************************************** type styles ********************************************************************************/ h1 { font-size: 20px; color: #FFF; font-weight: lighter; margin: 0; padding: 0; position: relative; top: 26px; left: 20px; float: left; } h2 { /*color: #5a7725;*/ color: #326954; font-size: 20px; font-weight: lighter; margin: 0; padding: 0; } h3 { color: #FFF; font-size: 12px; font-weight: lighter; margin: 0; padding: 0; } h3.grey { color: #898989; } h3.large { font-size: 15px; } h3.underline { border-bottom: solid 2px #EEE; padding-bottom: 5px; margin: 0 0 20px 0; } h4 { /*color: #5a7725;*/ color: #326954; font-size: 14px; font-weight: bolder; margin: 10px 0 0 0; } h4 span { /*color: #5a7725;*/ color: #326954; font-size: 14px; font-weight: bolder; margin: 10px 0 0 0; } h4.black { color: #00442b; } h5 { /*color: #00442b;*/ color: #326954; font-size: 12px; font-weight: bolder; margin: 10px 0 0 0; } h5.plain { font-weight: normal; } strong { /*color: #5a7725;*/ color: #326954; } p { color: #999; font-size: 11px; line-height: 150%; margin: 10px 0 0 0; } p.large { font-size: 13px; } p.hilight { color: #847c19; } a { /*color: #5a7725;*/ color: #326954; text-decoration: none; cursor : hand; } a img {border:none;} a:hover { color: #000; text-decoration: underline; } a.arrow { /*color: #5a7725;*/ color: #326954; background: url(../_imgs/arrowGreen.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } a.arrowLeft { background: url(../_imgs/arrowLeft.gif) no-repeat left 4px; padding: 0 0 0 15px; text-decoration: none; } a.arrowRight { background: url(../_imgs/arrowRight.gif) no-repeat right 4px; padding: 0 15px 0 0; text-decoration: none; } a.arrow:hover { text-decoration: underline; } #content ul, #content2 ul, #content3 ul { list-style: none; margin: 5px 0 0 10px; padding: 0; } #content ul li, #content2 ul li, #content3 ul li { color: #999; font-size: 11px; margin: 0; padding: 0 0 0 15px; line-height: 150%; background: url(../_imgs/bullet.gif) no-repeat 0 6px; position: relative; } /******************************************************************************** form ********************************************************************************/ .form { padding: 15px 10px 45px 10px; position: relative; } .form input, .form textarea, .form select { font-family: Arial, "Lucida Grande", Verdana, Helvetica, sans-serif; font-size: 12px; } .form h4 { color: #00442b; margin: 0 0 15px 15px; } .form div.row {margin-bottom:8px;clear:both;} .form div.row label {width:25%;float:left;font-size:11px;margin:8px 10px 0 15px;position:relative;color:#898989;} .form div.row span.required {position:absolute;left:-8px;} .form div.checkbox { position: relative; } .form div.checkbox label { width: auto; float: none; padding-left: 30px; display: block; } .form div.checkbox input { position: absolute; top: 0; left: 15px; } .form div.input input {width:60%;padding:4px;color:#665C53;border: 1px solid #dbdbdb;} .form div.select select {padding:4px;color:#665C53;border: 1px solid #dbdbdb;} .form div.file input {width:10px;color:#665C53;border: 1px solid #dbdbdb;} .form div.textarea textarea {width:60%;padding:4px;color:#665C53;border: 1px solid #dbdbdb; } .form input.submit { position: absolute; right: 15px; bottom: 10px; } .label { font-size: 12px; color: #00442b; } .label select { margin-right: 10px; font-size: 12px; } /******************************************************************************** footer ********************************************************************************/ #footer { font-size: 10px; color: #999; float: left; width: 940px; height: 40px; border-top: solid 1px #DDD; margin: 10px 0 0 0; padding: 10px 0 0 0; list-style: none; } #footer a { color: #999; text-decoration: none; padding: 0; float: left; } #footer a:hover { color: #ffd600; } #footer li { padding: 0; margin: 0; padding: 0 10px 0 10px; } #footer li.left {} #footer li.right {} #footer li.selected {} #footer li.selected a, #footer li.selected a:hover { color: #ffd600;} /******************************************************************************** various classes ********************************************************************************/ .clear { clear: both; } .cleaner { overflow: hidden; clear: both; height: 1px; margin-top: -1px; } .selfclear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .margin1 { margin: 0 0 0 9px; } .margin2 { margin: 5px 0 -5px 5px; } .margin3 { margin: 0 0 0 15px; } .margin4 { margin: 0 0 3px 0; } .margin5 { margin: 10px 0;} .margin6 { margin: 0 0 15px 0;} .margin7 { margin: 15px 0 0 0;} .margin8 { margin: 0 0 0 25px; } .margin9 { margin: 25px 0 0 0; } .margin10 { margin: 0 0 25px 0; } .margin11 { margin: 0 15px 0 0; } .left { float: left; } .right { float: right; } hr { border: none; background: #CCC; color: #CCC; height: 1px; } /* EXTRA FONT CLASSES TO SUPPORT THE TEXT EDITOR */ .strong { font-weight:bold; /*color: #5a7725;*/ color: #326954; } .h2 { /*color: #5a7725;*/ color: #326954; font-size: 20px; font-weight: lighter; margin: 0; padding: 0; } /* CROSS OVER SELLING BOXES */ .csbox2{ display: block; width: 187px; height: 140px; } .csbox2 a{ display: block; width: 187px; height: 140px; background-position:0 0; background-repeat:no-repeat; text-decoration: none; } .csbox2 a:hover{ background-position: 0 -140px; } .csbox2 a .alt { display: none; }