/* Saferoads Stylesheet */
* {margin: 0; padding: 0;} label, address {display: none;} a img, form, fieldset {border: none;} input {font-family: Helvetica, arial; color: #000;} a {color: #f60;} a:hover {text-decoration: none;} h1 {color: #000; font-weight: normal;} body {font-family: Helvetica, arial; color: #333; background: #000; font-size: 12px;}
/* Wraps */
#page {width: 955px; margin: 15px auto;}
/* Header Elements */
#header {height: 80px; width: 100%; background: url('images/black.png');} #header div {width: 955px; margin: 0 auto; padding: 10px 0;} #header h1 a {width: 320px; height: 60px; background: url('images/saferoads.png'); display: block; float: left;}
#header h2 a {width: 250px; height: 60px; background: url('images/phone.png'); display: block; float: right;}
#search {width: 280px; padding: 10px; background: #fff; border: 1px solid #ccc; margin: 10px 20px; float: left; font-size: 10px;}
/* Main Menu */
#banner {width: 955px; background: url('images/white.png');} #bannerPadding {padding: 15px;}
#nav, #nav ul {list-style: none;} #nav li {float: left; margin: 0 34px 10px 0; text-transform: uppercase; font-size: 10px;}
#nav li a {text-decoration: none; padding: 10px; font-weight: bold; display: block;}
#nav li a:hover {color: #333;}

#nav li .servicesList {display: none;} #nav li:hover .servicesList {position: absolute; width: 280px; background: url('images/black.png'); z-index: 9999; display: block;} #nav li:hover .servicesList li {margin: 0;} #nav li:hover .servicesList li a {width: 260px; display: block; color: #fff;} #nav li:hover .servicesList li a:hover {background: url('images/black.png'); color: #ff9;}

#nav li .servicesList li .subServicesList {display: none;} #nav li .servicesList li:hover .subServicesList {position: absolute; width: 280px; background: url('images/black.png'); z-index: 9999; display: block;} #nav li .servicesList li:hover .subServicesList li {margin: 0;} #nav li .servicesList li:hover .subServicesList li a {width: 260px; display: block; color: #fff;} #nav li .servicesList li .subServicesList li a:hover {background: url('images/black.png'); color: #ff9;}


#nav li .irList {display: none;} #nav li:hover .irList {position: absolute; width: 280px; background: url('images/black.png'); z-index: 9999; display: block;} #nav li:hover .irList li {margin: 0;} #nav li:hover .irList li a {width: 260px; display: block; color: #fff;} #nav li:hover .irList li a:hover {background: url('images/black.png'); color: #ff9;}

#homeBanner {width: 925px; height: 260px; clear: both;}
#aboutBanner {width: 925px; height: 120px; background: url('images/about-banner.jpg'); clear: both;}
#partnersBanner {width: 925px; height: 120px; background: url('images/standard-banner.gif'); clear: both;}
#productsBanner {width: 925px; height: 320px; clear: both; background: #000;}
#civilBanner {width: 925px; height: 120px; background: url('images/civil-banner.jpg'); clear: both;}
#mainProductBanner {width: 925px; height: 120px; background: url('images/product-banner.jpg'); clear: both;}
#mainProductBannerPadding {padding: 70px 0 0 20px;} #mainProductBannerPadding h1 {color: #fff;}
#investorBanner {width: 925px; background: #222; clear: both;}
#newsBanner {width: 925px; height: 120px; background: url('images/news-banner.jpg'); clear: both;}
#contactBanner {width: 925px; height: 340px; clear: both;}
#sitemapBanner {width: 925px; height: 120px; background: url('images/sitemap-banner.jpg'); clear: both;}
#linksBanner {width: 925px; height: 120px; background: url('images/links-banner.jpg'); clear: both;}
#rentalsBanner {width: 925px; height: 120px; background: url('images/rentals-banner.jpg'); clear: both;}

/* Product Group Banners */
#civilproductsBanner {width: 925px; height: 120px; background: url('images/civilproducts-banner.jpg'); clear: both;}
#cushionsBanner {width: 925px; height: 120px; background: url('images/cushions-banner.jpg'); clear: both;}
#guidepostsBanner {width: 925px; height: 120px; background: url('images/guideposts-banner.jpg'); clear: both;}
#lightingBanner {width: 925px; height: 120px; background: url('images/lighting-banner.jpg'); clear: both;}
#trafficcalmingBanner {width: 925px; height: 120px; background: url('images/trafficcalming-banner.jpg'); clear: both;}
#trafficcontrolBanner {width: 925px; height: 120px; background: url('images/trafficcontrol-banner.jpg'); clear: both;}
#trafficenforcementBanner {width: 925px; height: 120px; background: url('images/trafficenforcement-banner.jpg'); clear: both;}
#trafficsignalsBanner {width: 925px; height: 120px; background: url('images/trafficsignals-banner.jpg'); clear: both;}
#workzoneBanner {width: 925px; height: 120px; background: url('images/workzone-banner.jpg'); clear: both;}
#civilproductsBannerNoText {width: 925px; height: 120px; background: url('images/civilproducts-banner-notext.jpg'); clear: both;}
#cushionsBannerNoText {width: 925px; height: 120px; background: url('images/cushions-banner-notext.jpg'); clear: both;}
#guidepostsBannerNoText {width: 925px; height: 120px; background: url('images/guideposts-banner-notext.jpg'); clear: both;}
#lightingBannerNoText {width: 925px; height: 120px; background: url('images/lighting-banner-notext.jpg'); clear: both;}
#trafficcalmingBannerNoText {width: 925px; height: 120px; background: url('images/trafficcalming-banner-notext.jpg'); clear: both;}
#trafficcontrolBannerNoText {width: 925px; height: 120px; background: url('images/trafficcontrol-banner-notext.jpg'); clear: both;}
#trafficenforcementBannerNoText {width: 925px; height: 120px; background: url('images/trafficenforcement-banner-notext.jpg'); clear: both;}
#trafficsignalsBannerNoText {width: 925px; height: 120px; background: url('images/trafficsignals-banner-notext.jpg'); clear: both;}
#workzoneBannerNoText {width: 925px; height: 120px; background: url('images/workzone-banner-notext.jpg'); clear: both;}


/* Splash / Introduction */
#splashIntro {width: 306px; border-left: 1px solid #fff; height: 260px; position: relative; z-index: 3000; background: #222; color: #fff; float: right; font-size: 11px;} #splashIntroPadding {padding: 20px;} #splashIntro h2 {font-size: 14px; margin: 5px 0;} #splashIntro hr {border: none; height: 1px; background: #fff; margin: 10px 0;} #splashIntro .newsticker-jcarousellite {list-style: none; padding: 0;} #splashIntro .newsticker-jcarousellite li {background: none; width: 240px; height: 70px; overflow: hidden;} #splashIntro .newsticker-jcarousellite li p {width: 240px; line-height: 20px;} #splashIntro a {color: #ff3;} #splashIntro ul {list-style: none;}
#splashIntro #zoneLogin {width: 120px; height: 40px; line-height: 40px; margin: 10px 0 0 0; color: #000; display: block; text-decoration: none; background: url('images/zoneButton.gif'); text-align: center;} #splashIntro #zoneLogin:hover {background-position: 0 -40px; color: #ff3;}

#preview {position: absolute; z-index: 1;}

#breadCrumb {width: 955px; height: 30px; background: #fff; font-size: 11px;} #breadCrumb div {padding: 10px 16px;}
/* Key Links */
#keyLinks {width: 955px; height: 160px; background: url('images/white.png'); margin: 15px 0;} #keyLinks ul {list-style: none; padding: 10px 7px;} #keyLinks ul li {width: 303px; height: 140px; background: url('images/tiles.gif'); float: left; margin: 0 5px;} #keyLinks h2 {width: 160px; height: 15px; background: url('images/tile-headings.gif'); margin: 0 0 20px 0;} #keyLinks div {padding: 15px;} #keyLinks p {line-height: 18px; font-size: 11px;} #newsTile h2 {background-position: 0 -15px;} #investorTile h2 {background-position: 0 -30px;} #designTile h2 {background-position: 0 -45px;} #civilTile h2 {background-position: 0 -60px;} #relatedTile h2 {background-position: 0 -75px;} #productsTile h2 {background-position: 0 -105px;} #contactTile h2 {background-position: 0 -90px;} #requestTile h2 {background-position: 0 -122px; height: 16px; width: 200px;}

#keyLinks #newsTile {background-position: -303px 0;} #keyLinks #investorTile {background-position: -606px 0;} #keyLinks #designTile {background-position: -909px 0;} #keyLinks #civilTile {background-position: -1212px 0;} #keyLinks #relatedTile {background: url('images/tiles.gif') no-repeat -1515px 0; width: 929px; height: 140px;} #keyLinks #productsTile {background-position: -2444px 0;} #keyLinks #contactTile, #keyLinks #requestTile {background-position: -2747px 0;} #aboutTile p, #investorTile p, #designTile p, #civilTile p, #relatedTile p, #productsTile p, #contactTile p, #requestTile p {width: 200px;} #newsTile p {width: 260px;} #keyLinks ul li .relatedProduct {padding: 0; width: 380px; margin: 0 60px 0 0; float: left;} #keyLinks ul li .relatedProduct p {float: left; width: 200px;}
.previewImg {width: 150px; height: 100px; display: block;}
.productImage {width: 70px; height: 50px; float: right; margin: 0 1px 0 0;} #keyLinks h3 {font-size: 13px;}
/* Products Page */
#content #productContent h1 {font-size: 26px; font-weight: normal; text-transform: capitalize; background: none; width: 700px; letter-spacing: -1px; margin: 0 0 7px 0;} #productContent h2 {color: #222; font-weight: normal;} #content #productContent p {margin: 20px 0; width: 500px; line-height: 16px;} #productContent hr {margin: 20px 0;}
#keyFeatures ul {list-style: square; list-style-position: inside;} #keyFeatures ul li {margin: 5px 0;} #productGallery {float: right; border: 1px solid #ccc; background: #eee; list-style: none; width: 330px; margin: 0 0 0 100px;} #productGallery li {float: left; width: 100px; height: 100px; margin: 5px;} #productGallery li img {width: 100px; height: 100px;} #infoChart {width: 400px; float: left;} #infoChart td {width: 33%; padding: 5px;} #downloadResources {float: right; margin: 0 126px 0 0;} #downloadResources ul {list-style: none;}

.pdf {background: url('images/adobe.gif') no-repeat left center; text-transform: capitalize; padding: 3px 0 0 30px;}
.link {background: url('images/link.gif') no-repeat left center; padding: 3px 0 0 30px; text-transform: capitalize;}
.music {background: url('images/music.gif') no-repeat left center; text-transform: capitalize; padding: 3px 0 0 30px;}
.exe {background: url('images/exe.gif') no-repeat left center; text-transform: capitalize; padding: 3px 0 0 30px;}
.movie {background: url('images/movie.gif') no-repeat left center; text-transform: capitalize; padding: 3px 0 0 30px;}

#contactRequests li {background: url('images/contact.gif') left center no-repeat; padding: 3px 0 3px 30px;}
#content #qty_1, #content #qty_2, #content #qty_3 {width: 50px;}

#mainProductsContent ul {list-style: none; margin: 20px 0;} #mainProductsContent ul li {float: left; margin: 5px 5px 0 0;} #mainProductsContent ul li a {width: 150px; background: #f1f1f1; text-decoration: none; border: 1px solid #ccc; text-align: center; padding: 10px; display: block;} #mainProductsContent ul li a:hover {background: #ffc;} #mainProductsContent ul li img {margin: 5px 0;}
/* Main Content / Pages */
#content {width: 955px; background: #fff; margin: 15px 0;} #content p {line-height: 22px; margin: 0 0 20px 0;}
#content h2 {font-size: 14px; color: #f60; margin: 0 0 10px 0;} #aboutContent, #partnersContent, #productContent, #mainProductsContent, #investorsContent, #newsContent, #contactContent, #searchContent, #sitemapContent {padding: 20px;}
#aboutContent p {width: 565px;} #partneringCompanies {list-style: none;} #partneringCompanies li {border: 1px solid #ccc; padding: 10px; margin: 10px 0;} #partneringCompanies p {width: 800px;}

#investorLinks {list-style: none; width: 270px; float: left;} #investorLinks li {float: left;} #investorLinks li a {width: 270px; height: 40px; display: block; text-transform: uppercase; font-size: 10px; text-decoration: none; background: #222; color: #fff; font-weight: bold; text-indent: 10px; line-height: 40px;} #investorLinks li a:hover {background: #ff0; color: #000;}
#investorIntro {float: left; background: url('images/investor-banner.jpg'); width: 655px; min-height: 320px;} #investorResults {float: left; background: #eee; width: 655px; min-height: 320px;} #investorResults div {padding: 14px 20px;} .investorList {list-style: none; margin: 20px 0;} .investorList li {margin: 5px 0;} .investorList li a {text-decoration: none;} .investorList li a:hover {color: #000;}

#industryLinks {margin: 10px 0; list-style: none;} #industryLinks h2 {color: #000; margin: 0 0 4px 0; font-size: 13px;} #industryLinks li {padding: 8px; background: #eee; margin: 0 0 1px 0;}

#civilProjects {list-style: none;} #civilProjects li {width: 420px; padding: 10px; background: #f5f5f5; margin: 20px 0; border: 1px solid #ddd;} #civilProjects li h2, #civilProjects li h3, #civilProjects li h4 {font-size: 12px; text-transform: capitalize; color: #000; font-weight: normal; margin: 7px 0;} #civilProjects li b {width: 70px; float: left;}

#newsArticles {list-style: none;} #newsArticles li {width: 600px; margin: 20px 0 40px 0;} #newsArticles li h2, li h2 a {font-size: 14px; color: #000; text-decoration: none;} #newsArticles li h3 {font-size: 11px; color: #f60; margin: 5px 0; font-weight: normal;} #newsPagination {list-style: none; padding: 10px 0; border-top: 1px solid #000;} #newsPagination li {float: left;} #newsPagination li {margin: 0 10px 0 0;}
#contactBanner h1 {width: 270px; height: 30px; background: url('images/headings.gif') 0 -120px; margin: 0 0 10px 0;}
#contactContent input, textarea {font-family: Helvetica, arial; font-size: 12px; color: #000; padding: 7px; border: 1px solid #ccc; display: block;} #contactContent input {width: 300px; margin: 0 5px 5px 0;} #contactContent textarea {width: 400px; float: left; height: 120px;} #submitButton {width: 118px; height: 47px; background: url('images/submit.gif'); display: block; float: left; margin: 90px 0 0 4px;} #contactContent h1 {background: none; font-size: 26px; color: #f60; font-weight: normal; letter-spacing: -1px; width: 700px;}
#sitemapContent a {color: #000; text-decoration: none;} #sitemapContent a:hover {color: #f60;} #sitemapContent ul {list-style: none; margin: 0 0 20px 0;} #sitemapContent ul li {margin: 20px 0;} #sitemapContent ul li ul li {margin: 2px 0;}
.leftMap {float: left; width: 270px; margin: 0 50px 0 0;} .rightMap {float: left; padding: 0 0 0 100px; border-left: 1px solid #777;}
/* Footer */
#footer {font-size: 10px; font-weight: bold; color: #fff; text-align: center;} #footer a {color: #fff; text-decoration: none;} #footer a:hover {text-decoration: underline;} #footer ul {width: 530px; margin: 0 auto; list-style: none;} #footer ul li {float: left; margin: 5px;} #footer ul li a {color: #fff; text-decoration: none; color: #ff0;}
/* Misc Classes */
.clearBoth {clear: both;} .floatRight {float: right; margin: 0 0 0 100px;} .floatLeft {float: left; margin: 0 100px 0 0;}
.fieldDiv {float: left;}
#content .noHeading {background: none; width: 700px; margin: 0 0 10px 0;}
#content h4 {margin: 0 0 7px 0; font-size: 11px;}
#content .aboutImg {float: right; width: 250px;} .aboutImg img {margin: 1px 0 0 0;}

/* Contact Form */
#contactdiv {width: 600px;} #contactdiv fieldset {margin: 10px 0;} #contactdiv .field {padding: 10px; margin: 5px 5px 0 0; border: 1px solid #ccc; width: 250px;} #contactdiv textarea {font-family: arial; font-size: 11px; width: 533px; height: 100px; border: 1px solid #ccc; margin: 5px 0 0 0;} #contactdiv .smallfield {padding: 3px; margin: 5px 0 0 5px; border: 1px solid #ccc; width: 300px;} .qty {margin: 5px 0 0 50px;}

/* Search Results */
.results {list-style: none;} .results li {margin: 10px 0; background: #f1f1f1; border: 1px solid #ccc;} .results li a {padding: 10px; display: block;} .results li a b {font-size: 11px; text-transform: uppercase;} .results li a strong {font-size: 10px; color: #333;}

/* Slideshow */
#slideshow {width: 619px; height: 260px; position:absolute;} #slideshow div {position:absolute; top:0; left:0; z-index:8; opacity:0.0; height: 320px;} #slideshow div.active {z-index:10; opacity:1.0;} #slideshow div.last-active {z-index:9;} #slideshow div img {width: 619px; height: 260px; display: block; border: 0;}

/* News Ticker */
#newsTile .newsticker-jcarousellite {list-style: none; padding: 0;} #newsTile .newsticker-jcarousellite li {background: none; width: 240px; height: 50px; overflow: hidden;} #newsTile .newsticker-jcarousellite li p {width: 240px;}
/* Lightbox */
#jquery-overlay {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px;} #jquery-lightbox {position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;} #jquery-lightbox a img { border: none;} #lightbox-container-image-box {position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;} #lightbox-container-image { padding: 10px;} #lightbox-loading {position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;} #lightbox-nav {position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10;} #lightbox-container-image-box > #lightbox-nav { left: 0;}#lightbox-nav a { outline: none;} #lightbox-nav-btnPrev, #lightbox-nav-btnNext {width: 49%; height: 100%; zoom: 1; display: block;} #lightbox-nav-btnPrev {left: 0; float: left;} #lightbox-nav-btnNext {right: 0; float: right;}#lightbox-container-image-data-box {font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0;} #lightbox-container-image-data {padding: 0 10px; color: #666;} #lightbox-container-image-data #lightbox-image-details {width: 70%; float: left; text-align: left;} #lightbox-image-details-caption { font-weight: bold;} #lightbox-image-details-currentNumber {display: block; clear: left; padding-bottom: 1.0em;}#lightbox-secNav-btnClose {width: 66px; float: right; padding-bottom: 0.7em;} .none {display: none;}
#content .productImg {width: 100px; height: 100px;}