/* reset */html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,sup,sub,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,#footer,#header,hgroup,nav,section{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-family:inherit;font-size:100%;vertical-align:baseline;background-color:transparent}dl,dt,dd,ol,ul,li{list-style:none}table{border-collapse:separate;border-spacing:0;}caption,th,td{text-align:left;font-weight:normal}table,td,th{vertical-align:middle;}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:"" "";}aimg{border:none}article,aside,dialog,figure,#footer,#header,hgroup,nav,section{display:block} /* should validate as CSS3 */ html { font: 12px/17px "Trebuchet MS", verdana, aria, sans-serif; /* 12/17px */ color: #59584f; background: #bec1b6 url(/themes/site_themes/default_site/assets/css/css_images/background-gradient.png) repeat-x left top; } body { position: relative; background: #FFF; width: 940px; padding: 0 20px; /* 20px -- makes this 980 rather than 960, but white space is good */ padding-bottom: 10px; /* 10px */ margin: 0 auto; } @media screen and (max-width: 1024px) { body { padding: 0 10px; /* force 960 on netbooks, old laptops, etc */ } } /* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 2, 2010 */ @font-face { font-family: 'AkagiBold'; src: url('/themes/site_themes/default_site/assets/akagi-bd-webfont.eot'); src: local('☺'), url('/themes/site_themes/default_site/assets/akagi-bd-webfont.woff') format('woff'), url('/themes/site_themes/default_site/assets/akagi-bd-webfont.ttf') format('truetype'), url('/themes/site_themes/default_site/assets/akagi-bd-webfont.svg#webfontv4s9zjgx') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'AkagiBook'; src: url('/themes/site_themes/default_site/assets/akagi-bk-webfont.eot'); src: local('☺'), url('/themes/site_themes/default_site/assets/akagi-bk-webfont.woff') format('woff'), url('/themes/site_themes/default_site/assets/akagi-bk-webfont.ttf') format('truetype'), url('/themes/site_themes/default_site/assets/akagi-bk-webfont.svg#webfontPgTon7Op') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'AkagiBlack'; src: url('/themes/site_themes/default_site/assets/akagi-bl-webfont.eot'); src: local('☺'), url('/themes/site_themes/default_site/assets/akagi-bl-webfont.woff') format('woff'), url('/themes/site_themes/default_site/assets/akagi-bl-webfont.ttf') format('truetype'), url('/themes/site_themes/default_site/assets/akagi-bl-webfont.svg#webfontnPbvPQii') format('svg'); font-weight: normal; font-style: normal; } /* BASE TYPOGRAPHY */ p, #content > ul { margin-bottom: 17px; } h2, .deck, #content > .aside { font-family: AkagiBook; color: #003f5e; font-size: 18px; line-height: 26px; margin-top: 22px; font-weight: 400 } #content h2 > a { color: #003f5e; } .icon{ float: left; margin-top: 0px; padding-right: 20px; width: 400px; height: 80px; } .deck { margin-top: 25px; padding-bottom: 9px; } h2 + .deck { width: 590px; margin-top: 0; padding: 0; font-weight: 400 } h1 { font-family: AkagiBlack; font-weight: 400 } h2 { font-family: AkagiBold; font-weight: 400 } h3, #secondary h2 { font-size: 14px; line-height: 17px; margin-top: 17px; } .title { margin-top: 26px; } #secondary > #social + h2, #secondary > h3.link { border-top: 0; } #secondary > h3.link { margin-top: 0; text-align: right } #secondary > h3.link > a { font-size: 11px; font-family: AkagiBook; text-transform: uppercase; letter-spacing: .25px } h3, .formsection > label { font-family: AkagiBold; font-weight: 400 } /* LINK STYLES */ a { text-decoration: none; /*color: #b5001b;*/ color: #e51937; } a:visited { color: #e51937; } #footer a { color: #FFF } a:hover { color: #e51937; text-decoration: underline } #header a:hover { text-decoration: none } sup { font-size: 75%; vertical-align: top } sub { font-size: 75%; vertical-align: bottom } /* HEADER REGION */ #header { background: url(/themes/site_themes/default_site/assets/css/css_images/heading.png) no-repeat 24px 0; } #header > ul { clear: both; overflow: hidden; } #header > ul:first-child { float: left; clear: none; } #header > ul:first-child > li { position: absolute; left: -100%; } #header #site-id { position: static; } #site-id a { display: block; width: 170px; height: 70px; margin-left: -10px; text-indent: -100%; overflow: hidden; background: url(/themes/site_themes/default_site/assets/css/css_images/arclin.png) no-repeat 0 0; } #francais { display: block; width:170px; height: 70px; margin-left: 852px; margin-top: 6px; position: absolute; overflow: hidden; text-indent: 25px; background: url(/images/canada-flag.png) no-repeat 0 0; } /* SEARCH */ #header > form { font-size: 10px; float: right; width: 220px; height: 22px; margin-top: 42px; margin-bottom: 25px; position: relative; } label[for=search] { position: absolute; left: 5px; top: 3px; z-index: -1 } .hasJS label[for=search] { z-index: 2 } #search, #header button { border: 0; line-height: 1; padding: 0; margin: 0; z-index: 1; position: absolute; top: 0; } #search { font-size: 12px; height: 100%; width: 173px; padding-left: 5px; background: #f3f2ed; vertical-align: baseline } #header button { background: #e2dcbf url(/themes/site_themes/default_site/assets/css/css_images/buttons.png) no-repeat 0 0; font-size: 1em; width: 38px; height: 22px; padding-bottom: 1px; text-align: center; text-transform: lowercase; font-variant: small-caps; font-weight: bold; color: #fff; overflow: hidden; text-indent: 100%; cursor: pointer; right: 0 } #header button:hover, #header button:focus { border: 2px solid #c9c4ab; background-position: -2px -2px } #search:focus + label { display: none; z-index: -1 } #nav { text-transform: uppercase; margin: 0 0 16px 0; } #nav > li { float: left; margin-left: 15px; font-weight: bold; z-index: 100 } #nav > li:first-child { margin-left: 0; } #nav > li > a { display: block; padding: 5px 10px; color: #61644c } #nav > li.current, #nav > li:hover { color: #FFF; background-color: #e51937; } #nav > li.current a, #nav > li:hover a { color: #FFF; } #nav > li > a:hover { text-decoration: none } #nav > li > ul { text-transform: none; padding: 5px 0 10px 0; position: absolute; left: -1000%; background-color: #e51937; z-index: 101; min-width: 144px } #nav > li:hover > ul { display: block; left: auto } /* sub nav */ #nav > li > ul > li { font-size: 11px; line-height: 17px; } #nav > li > ul > li > a { display: block; padding: 5px 10px; margin: 0 1px; } #nav > li > ul > li > a:hover { background: #cc001f } /* INTERIOR */ #content > h1 { font-size: 22px; width: 630px; margin-left: -15px; text-transform: uppercase; text-align: right; color: #FFF; padding: 100px 20px 14px 0; text-shadow: 0 0 2px #aaa; -moz-border-radius-topleft: 20px; -webkit-border-top-left-radius: 20px; border-top-left-radius: 20px; } #content > h1.aeb463 { color: #aeb463; text-shadow: 0 0 2px #eee; } #news h1, #archive h1 { background: url(/images/headers/news-header.jpg) 0 0; /* note: this is not ideal since most header backgrounds are dynamic */ } #breadcrumbs { font-size: 11px; line-height: 15px; width: 910px; width: 615px; display: block; float: none; clear: both; margin: 13px -15px 0 -15px; padding: 0 310px 16px 15px; height: 19px; border-bottom: 1px solid #e2e0d9 } #breadcrumbs + p, #breadcrumbs + ul { margin-top: 17px } /* BODY CONTENT */ #home #content { width: 615px; padding-left: 15px; padding-right: 20px; margin-right: -5px; float: left; height: 620px; overflow: hidden; } #content { width: 615px; padding-left: 15px; padding-right: 20px; margin-right: -5px; float: left; } #content > ul ul, #product ul { padding-left: 20px; } #content > ul { padding-left: 15px } #home #content > ul { padding-left: 0 } #content > #products, #content > .products { padding-left: 0 } #content > ul > li, #product li { list-style: url(/images/01/bull.png) disc } #content li li { list-style: url(/images/01/bull.png) circle } #content .aside, .aside > p { font-size: 18px; } #content .aside { font-family: AkagiBook; float: right; width: 190px; padding: 10px; padding-bottom: 0; margin: -5px 0 0 10px; color: #FFF; background: #003f5e; overflow: hidden } #content > .aside small { font-size: 12px; line-height: 12px; } #content > .aside a { color: #B3D334; font-family: AkagiBold; } #content > .aside a:hover { color: #FFF } /* RIGHT COLUMN */ #communicate { position: relative; padding-left: 0; height: 131px; background: #e2dcbf; overflow: hidden; -moz-border-radius-bottomright: 20px; -webkit-border-bottom-right-radius: 20px; border-bottom-right-radius: 20px; } #communicate > p { position: absolute; bottom: 0; margin: 0; line-height: 1.4; font-size: 15px; font-family: AkagiBook; font-weight: normal; color: #003f5e; vertical-align: baseline; } #communicate a { font-size: 14px } #communicate > p > span, #communicate > p > b { font-size: 22px; font-family: AkagiBlack; font-weight: 400; color: #FFF; text-shadow: 0 0 2px #aaa; display: block; padding-bottom: 6px; } #communicate > p > b { } #communicate > p > small { font-size: 11px; line-height: 17px; margin-top: -3px; display: block; } #social { font-size: 11px; display: block; float: none; clear: both; margin: 16px 0 0 -15px; padding: 0 0 16px 20px; } #social > div > a { margin: 0 10px; } #secondary { margin-left: 5px; float: right; width: 285px; } #secondary h2, #resources #content h3, h3.link { padding: 12px 0 4px 15px; } #resources #content h3 { margin-left: -15px; margin-right: -15px; } #secondary h2, #resources #content h3, #secondary .nav > li, h3.link { font-weight: 400; border-bottom: 1px solid #e2e0d9; border-top: 1px solid #e2e0d9; } #secondary ul + h2, #social + h2 { border-top: 0 } #secondary h3, #secondary p, #secondary h4 { padding-left: 15px } #secondary .nav a { display: block; font-size: 12px; padding: 8px 0 8px 15px; } #secondary .nav a:visited { color: #B5001B } #secondary .nav a:hover, #secondary .nav > li > .nav > .current > a { text-decoration: none; background-color: #e2dcbf; color: #003F5E } #secondary .nav > .current-top > a { font-weight: bold; } #secondary .nav > .current > a { padding-left: 35px; font-weight: bold; color: #FFF; background: #E51937 url(/themes/site_themes/default_site/assets/css/css_images/dot.png) no-repeat 10px 50%; } #secondary .nav > li > .nav { margin-bottom: -1px; display: none } #secondary .nav > li > .nav > li > a { padding-left: 35px } #secondary .nav > li { font-size: 14px; border-top: none } #e-gen, #rel-resources, #certificates { margin-top: 17px; margin-bottom: 17px; overflow: hidden; } #e-gen img { float: left; padding: 0 10px; margin-right: 10px; } #e-gen > p { margin-top: 14px; padding-right: 10px; margin-bottom: 0 } #certificates > li { float: left } /* PRODUCTS */ .products { width: 290px; line-height: 15px; margin-bottom: 17px; padding-bottom: 17px; margin-left: -5px; overflow: hidden; } .products > li > h3 { font-size: 13px; margin: 0 5px; padding: 0 } .products > li > h3 > a, #secondary > h2 > a { color: #003f5e; } .products > li > h3 > a:hover, #secondary > h2 > a:hover, #secondary > h3 > a:hover { border: 0; color: #e51937 } .products, .products > li { float: left; list-style: none !important /* sorry */ } .products > li { padding-top: 10px; padding-bottom: 10px; min-height: 200px; } .surface .products > li { min-height: 120px !important } .narrow, .wide { float: left; background: #f3f2ed; border-left: 10px solid #f3f2ed; margin-left: -20px; margin-right: 10px; overflow: hidden; } .narrow { width: 320px; margin-right: 20px } .products.wide { width: 625px; float: none; clear: both } .narrow > li, .wide > li { width: 150px; padding: 10px; margin-left: -10px; background: #f3f2ed; } .wide { margin-left: -15px; overflow: hidden; float: none; } .wide > li { width: 150px; padding: 10px; padding-left: 5px; margin: 0 -5px; background: #f3f2ed; } .wide > li:first-child { padding-left: 10px; margin-left: -10px } .listrow { width: 700px } .listrow > li { width: 290px; margin-left: 15px; padding-left: 15px; border-left: 1px solid #eee; float: left; } .listrow > li:first-child { margin-left: 0; padding-left: 0; border-left: 0 } .products > li > p { padding: 0 5px } .products > li > img { border: 5px solid #e2e0d9; margin-bottom: 5px } .more { display: block; overflow: hidden; height: 22px; width: 52px; margin-top: 12px; margin-bottom: -22px; background: url(/themes/site_themes/default_site/assets/css/css_images/buttons.png) no-repeat 0 -32px; text-indent: -100% } a.more:hover { background-position: 0 -55px} /* on product pages */ .product-image { float: left; margin-right: 20px; } #product { clear: left } #product, #product-info { overflow: hidden; } #product-info { } #product-info li { list-style: disc outside url("/images/01/bull.png") } #product > div, #product-info > div { float: left; width: 290px; } #product > div:first-child, #product-info > div:first-child { margin-right: 20px; } #left-col, #right-col, .left-col, .right-col { width: 290px; overflow: hidden; float: left; padding: 0 10px; margin-top: 17px; margin-bottom: 17px; } #left-col ul, /* left-col and right-col belong to pages, not products */ #right-col ul, .left-col ul, .right-col ul, #product ul, #product-info ul { padding-left: 15px } #left-col > ul li, #right-col > ul li, .left-col > ul li, .right-col > ul li, #product > ul li, #product-info > ul li { list-style: url(/images/01/bull.png) disc } #left-col, .left-col { margin-left: -10px; clear: left } #right-col, .right-col { float: right; clear: right } #right-col.level { margin-top: -40px } #left-col img, #right-col img, .left-col img, .right-col img { max-width: 300px } #product-info { padding-left: 20px; margin-left: -20px; margin-top: 17px; margin-bottom: 17px; } #product-info + h2 { clear: both } .more:hover { border: 0 } .hasJS #faq div { overflow: hidden; } .hasJS #faq h3 { cursor: pointer; padding: 8px; border: 1px solid #d0dc87 } .hasJS #faq h3:hover, .hasJS #faq h3.current { background: #d0dc87 } .hasJS #faq p { padding: 0 10px; margin: 8.5px 0 } #faq { margin-bottom: 34px } /* OUR COMPANY */ h2.leadership + h3 { margin-top: 0; margin-bottom: 17px } /* NEWS */ #body-split-primary { width: 400px; margin-right: 15px; float: left; text-align: justify; } #body-split-secondary { width: 200px; float: right; margin-top: 60px; margin-right: -10px; overflow: hidden; clear: right; } #body-split-secondary > h2:first-child { margin-bottom: -3px } #body-split-secondary > ul { margin-bottom: 17px; } #body-split-secondary > ul > li { } #events { background: #f3f2ed; border: 2px solid #e2e0d9; padding: 5px; padding-left: 10px; } #body-split-secondary h2 { margin-top: 3px; font-size: 14px; } #events > h3 { font-size: 18px; margin-top: 13px; font-weight: 400 } #archive #content > h3 { font-family: AkagiBook; font-weight: 400; margin-top: 9px; padding-left: 5px } #archive #content > h3 > span { display: inline-block; min-width: 130px; margin-left: -135px } #archive #content > h3 { margin-left: 130px; } #archive #content > h2 { } /* RESOURCE LIBRARY */ .resource-list { overflow: hidden; margin-bottom: 12px; -moz-column-gap: 20px; -moz-column-count: 1; -webkit-column-gap: 20px; -webkit-column-count: 1; column-gap: 20px; column-count: 1 } .resource-list > li { list-style: none; margin-top: 8px; margin-bottom: 1px; } /* RESOURCE LIBRARY EXTERNAL LINKS*/ .links-list { overflow: hidden; margin-top: -12px; -moz-column-count: 1; -webkit-column-gap: 20px; -webkit-column-count: 1; column-gap: 20px; column-count: 1 } .links-list > li { list-style: none; margin-top: 0px; margin-bottom: 5px; } .links-gray{ color: #666; } /* CONTACT/LOCATIONS/FORMS */ #addresses { overflow: hidden; } #addresses div {float: left; width: 170px; margin: 17px 15px 17px 0; padding-left: 20px; border-left: 1px solid #e2e0d9; min-height: 835px} #addresses div:first-child { border-left: 0; padding-left: 0} #addresses > div > ul:first-child {margin-top: 0} #addresses ul { float: none; margin: 17px 0; height: 150px; width: 190px; } #addresses h4 { font-weight: bold } form > ul li { list-style: none } #ctForm0 li { overflow: hidden; margin: 10px 0 7px 0 } #submit #freeform li { overflow: hidden; margin: 4px 0 } #ctForm0 label { display: block; float: left; vertical-align: bottom; padding-top: 6px } #ctForm0 input { float: right } #ctForm0 textarea, #submit #freeform textarea, #ctForm0 input, #submit #freeform input[type=text], #ctForm0 select #submit #freeform select { width:200px; } #ctForm0 textarea, #submit #freeform textarea, #ctForm0 input, #submit #freeform input[type=text], #ctForm0 select #submit #freeform select, .form input, .form textarea { border:1px solid #999; -webkit-border-radius: 3px;-khtml-border-radius:3px;-moz-border-radius:3px;border-radius:3px; margin:0; padding:3px 5px; background: #fff; background: -webkit-gradient(linear, left top, left 25, from(#fff), color-stop(6%, #eee), to(#fff)); background: -moz-linear-gradient(top, #fff, #eee 2px, #fff 25px); box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; } #ctForm0 select, #submit #freeform select { width: 275px } #ctForm0 textarea, #submit #freeform textarea { height:100px; width: 263px; } #ctForm0 input[type=submit], #submit #freeform input[type=submit] { width:auto; background: #efefef; background: -webkit-gradient(linear, left top, left 25, from(#dadada), color-stop(6%, #efefef), to(#dadada)); background: -moz-linear-gradient(top, #dadada, #efefef 2px, #dadada 25px); box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; } #ctForm0 input[type=submit]:hover, #submit #freeform input[type=submit]:hover, #ctForm0 input[type=submit]:focus, #submit #freeform input[type=submit]:focus { background: #c9c4ab; background: -webkit-gradient(linear, left top, left 25, from(#e2dcbf), color-stop(6%, #c9c4ab), to(#e2dcbf)); background: -moz-linear-gradient(top, #e2dcbf, #c9c4ab 2px, #e2dcbf 25px); box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; cursor: pointer } #statusgroup, #areagroup {zoom: 1; overflow: hidden } #statusgroup > li, #areagroup > li { float: left } #statusgroup > li label, #areagroup > li label { margin-left: 2px; margin-right: 15px } #submit #freeform .formsection { margin-top: 17px } /* FOOTER */ #footer { clear: both; /* height: 42px; */ width: 960px; margin-left: -10px; padding-top: 10px } #footer > ul { background: #97a253; padding: 10px 20px 25px 20px; } #footer li { float: right; margin-left: 20px; } #footer li:first-child { float: left; margin-left: 0; } /* misc */ #home h1 { position: absolute; left: -1000% } .left { float: left; margin-right: 20px } .right { float: right; margin-left: 20px; padding-left: 10px; } .clear-both { clear: both } .alert { font-size: 14px !important; text-transform: uppercase !important; color: red !important } #promote { line-height: 0; display: block; border: 5px solid #e2e0d9; } #promote:hover { border: 5px solid #e51937 } /* DECORATIVE SURFACES CATEGORY LANDING */ #decorative-one, #decorative-two, #decorative-three { float: left; width: 190px; margin-left: 20px } #decorative-one { margin-left: 0 } #dmo #promote { display:none} /* semantics and accessibility aids */ h2.hide { position: absolute; left: -1000% } .jsTogl #faq { visibility: hidden } .egencert {position: relative; /* background: url(/images/01/E-Gen-Leaf-icon.png) no-repeat right top */ } .egen-icon { display: block; width: 16px; height: 16px; position: absolute; top: 0; left: 128px; } .egencert > a { display: inline-block; padding-right: 16px; } #thankyou h1 {background: url(/images/headers/partnership-header.jpg) no-repeat 0 0;} /* CAREERS */ #submit { top: 20px !important; display: none; z-index:10000; background-color:#fff; width: 400px; overflow-y: scroll; overflow-x: hidden; border:1px solid #ddd; /* -moz-box-shadow: 5px 5px 5px #333; -webkit-box-shadow: 0 0 5px #333; */ padding: 15px 60px } /* close button positioned on upper right corner #submit .close { background-image:url(/images/01/fancy_close.png); position:absolute; right:-15px; top:-15px; cursor:pointer; height:30px; width:30px; } */ .details { position:absolute; top:15px; right:15px; font-size:11px; color:#fff; width:150px; } .details h3 { color:#aba; font-size:15px; margin:0 0 -10px 0; } .hasJS #exposeMask { position: absolute; top: 0px; left: -100% !important; width: 2000% !important; height: 200%; display: block; opacity: 0.8; z-index: 9998; } /* this is a horrible hack, sorry world */ .hasJS #jsmove { display: none } /* more misc random hacky stuff */ .prds div div li { margin-left: 15px } /* ADDED 20110414 AlertBox */ #alertbox { background:#F3F2ED; padding-bottom: 17px; } #alertbox + h2 { margin-top: 0 } #alertbox > h2 { background: #e51937; color: #FFF; text-transform: uppercase; position: relative } #alertbox > h2 > span { position: absolute; right: 10px; } /* jqModal base Styling courtesy of; Brice Burgess */ /* The Window's CSS z-index value is respected (takes priority). If none is supplied, the Window's z-index value will be set to 3000 by default (via jqModal.js). */ .jqmWindow { display: none; position: fixed; top: 17%; left: 50%; margin-left: -300px; width: 600px; background-color: #EEE; color: #333; border: 1px solid black; padding: 12px; } .jqmOverlay { background-color: #000; } /* Background iframe styling for IE6. Prevents ActiveX bleed-through (