@charset "utf-8";
/* CSS Document */

* { margin: 0; padding: 0; border: none; }
html { background: url(htmlBG.gif) top left repeat; height: 100%; font: 12px/15px Arial, Helvetica, sans-serif; }
body { background: url(topBar.png) top left repeat-x; height: 100%; }

a { text-decoration: none; color: #456d00;  }
a:hover { text-decoration: underline; color: #000;  }

.topLinks { width: 988px; padding: 0 12px; height: 16px; padding: 9px 0 8px 0; margin: 0 auto; font: 10px/16px Arial, Helvetica, sans-serif; color: #fff; text-align: right; white-space: nowrap; letter-spacing: 1px; }
.topLinks a { color: #fff; }
.topLinks select { background: #006aa1; color: #fff; font: 10px/10px Arial, Helvetica, sans-serif; border-left: 1px solid #00496e; border-top: 1px solid #00496e; border-bottom: 1px solid #006aa1; }

.adspace { background: #fff; }

.header { width: 715px; padding: 102px 42px 0px 255px; font: bold 13px/22px Arial, Helvetica, sans-serif; white-space: nowrap; height: 22px; margin: 0 auto; position: relative; }
.header .adspace { position: absolute; right: 24px; top: 20px; }
.header .banner { width: 468px; height: 60px; }
.header .toolbar { float: right; letter-spacing: 1px; }
.header .toolbar a { color: #006aa1; padding: 0 11px; border-left: 1px solid #cfcfcf; display: block; height: 22px; float: left; }
.header .toolbar a.on { color: #fff; background: #d6d6d6; border-left: 1px solid #d6d6d6; }
.header .logo { display: block; width: 385px; height: 127px; background: url(logoBg.png) top left no-repeat; position: absolute; left: 25px; top: -32px; }
.header .logo a { display: block; width: 345px; height: 109px; background: url(logo.png) top left no-repeat; position: absolute; left: 20px; top: 37px; }

.container { clear: both; width: 962px; padding: 0 25px 0 26px; margin: 0 auto; background: url(containerBg.png) center top repeat-y; }

.adContainer { float: right; padding: 20px; }
.adContainer .skyscraper { width: 160px; height: 600px; margin: 14px 0 0 0; }

.mainContent { width: 710px; float: right; margin: 0 16px 16px 0; }
.mainContent .skyscraper { float: right; clear: right; width: 160px; height: 600px; }
.mainContent .breadcrumbs { padding: 8px 0 8px 2px; font: 14px/16px Arial, Helvetica, sans-serif; }
.mainContent .content { float: left; width: 500px; padding: 14px; background: #f1f1f3; border-top: 1px solid #ddd; border-bottom: 2px solid #aaa; border-left: 1px solid #ccc; border-right: 2px solid #bbb; }
.mainContent .content strong, .mainContent .content b { color: #006993; font-size: larger; }
.mainContent h1 { font: bold 30px/34px Arial, Helvetica, sans-serif; color: #0083aa; padding: 8px 0; }
.mainContent ul { margin: 8px; padding: 0px 8px; list-style-type: square; }
.mainContent ol { margin: 8px; padding: 0px 8px; }
.mainContent p { margin: 8px 0; }
.mainContent h2 { font: bold 26px/30px Arial, Helvetica, sans-serif; color: #006993; padding: 8px 0; }
.mainContent h3 { font: bold 22px/26px Arial, Helvetica, sans-serif; color: #666; padding: 8px 0; }
.mainContent h4 { font: bold 18px/22px Arial, Helvetica, sans-serif; color: #333; padding: 8px 0; }
.mainContent h5 { font: bold 14px/18px Arial, Helvetica, sans-serif; color: #000; padding: 8px 0; }
.mainContent input { padding: 4px; border: 1px solid #888; font: 11px/13px Arial, Helvetica, sans-serif; }
.mainContent select { border: 1px solid #888; font: 11px/13px Arial, Helvetica, sans-serif; }
.mainContent textarea { padding: 4px; border: 1px solid #888; font: 11px/13px Arial, Helvetica, sans-serif; }
.mainContent a.career { display: block; background: #fff; border: 1px solid #ccc; padding: 10px 10px 10px 70px; margin: 0 0 10px 0; color: #555; background-repeat: no-repeat; background-position: 10px 10px; }
.mainContent a.career:hover { text-decoration: none; background-color: #ccc; color: #000; border-color: #aaa; }
.mainContent a.career h4 { font: bold 14px/16px Arial, Helvetica, sans-serif; color: #333; padding: 0 0; width: 280px; }
.mainContent a.career .postDate { float: right; }

/* Feature panel */
.features { width: 228px; padding: 0px 17px; background: url(featureCenter.png) 0px 0px repeat-y; margin: 62px 0 248px -30px; float: left; position: relative; }
.features .featureHeader { height: 38px; position: absolute; top: -62px; left: 0px; width: 224px; background: url(featureTop.png) 0px 0px no-repeat; font: bold 20px/34px Arial, Helvetica, sans-serif; color: #fff; text-shadow: #555 0px 1px 1px; padding: 24px 0 0 40px; }
.features .featureBottom { width: 264px; height: 248px; background: url(featureBottom.png) 0px 0px no-repeat; position: absolute; left: 0px; bottom: -248px; }
.features .featureBottom .square { width: 200px; height: 200px; position: absolute; left: 46px; top: 32px; }
.features .featureWrapper { background: url(featureBgBottom.png) center bottom no-repeat; } 
.features .feature { padding: 12px 6px 12px 60px; background-repeat: no-repeat; background-position: 6px 16px; font: 11px/14px Arial, Helvetica, sans-serif; color: #636363; }
.features .feature a { display: block; padding: 5px 5px 5px 20px; background: url(linkChevrons.png) left center no-repeat; }
.features .feature a:hover { color: #000; background-image: url(linkChevronsHover.png); }
.features .feature h5 { color: #006993; font: bold 14px/18px Arial, Helvetica, sans-serif; }
.features .splitter { height: 33px; width: 230px; background: url(featureDivider.png) center center no-repeat; }

/* Styles for Search and Browse component, home page variation */
.searchBrowseArea { height: 286px; position: relative; width: 660px; }
.searchBrowse { width: 799px; height: 302px; position: absolute; left: -30px; top: -8px; }
.searchBrowse h3 { font: bold 18px/24px Arial, Helvetica, sans-serif; color: #fff; text-shadow: #555 0px 1px 1px; margin: 16px 0 0 0; }
.searchBrowse .search { width: 238px; background: url(greenCenterBg.png) center left repeat-x; margin: 0 14px 0 59px; height: 302px; position: absolute; top: 0px; left: 0px; }
.searchBrowse .search .leftEnd { position: absolute; left: -59px; top: 0px; background: url(greenLeftBg.png) center left no-repeat; width: 59px; height: 302px; }
.searchBrowse .search .rightEnd { position: absolute; right: -14px; top: 0px; background: url(greenRightBg.png) center left no-repeat; width: 14px; height: 302px; }
.searchBrowse .search .content { position: absolute; left: -30px; top: 50px; width: 270px; height: 260px; }
.searchBrowse .search .content h3 { font: bold 14px/16px Arial, Helvetica, sans-serif; color: #fff; text-shadow: none; margin: 8px 0 2px 0; }
.searchBrowse .search .content .inputWrapper { border-top: 2px solid #959595; border-left: 1px solid #bdbdbd; border-right: 1px solid #d0d0d0; border-bottom: 1px solid #ececec; }
.searchBrowse .search .content .inputWrapper2 { border-top: 1px solid #c6c6c6; border-left: 1px solid #e4e4e4; border-right: 1px solid #e3e3e3; border-bottom: 1px solid #f2f2f2; }
.searchBrowse .search .content input { display: block; width: 100%; color: #666666; font: 12px/12px Arial, Helvetica, sans-serif; height: 12px; text-indent: 10px; padding: 2px 0; }
.searchBrowse .search .content select { display: block; width: 100%; color: #666666; font: 12px/12px Arial, Helvetica, sans-serif; height: 16px; padding: 0px 0 0px 7px; }
.searchBrowse .search .content p { color: #fff; font: 11px/13px Arial, Helvetica, sans-serif; padding: 4px 0; }
.searchBrowse .browse { width: 422px; background: url(blueCenterBg.png) center left repeat-x; margin: 0 46px 0 20px; height: 302px; position: absolute; top: 0px; right: 0px; }
.searchBrowse .browse .leftEnd { position: absolute; left: -20px; top: 0px; background: url(blueLeftBg.png) center left no-repeat; width: 20px; height: 302px; }
.searchBrowse .browse .rightEnd { position: absolute; right: -46px; top: 0px; background: url(blueRightBg.png) bottom left no-repeat; width: 46px; height: 302px; }
.searchBrowse .browse .content { width: 430px; padding: 0 12px; background: url(blueDivider.png) 0 24px no-repeat; position: absolute; left: -12px; top: 60px; color: #fff; font: 10px/12px Arial, Helvetica, sans-serif; }
.searchBrowse .browse .content a { color: #fff; }
.searchBrowse .browse .content h4 { font: bold 14px/16px Arial, Helvetica, sans-serif; margin: 0 0 16px 0; }
.searchBrowse .browse .content li { font: 8px/14px Arial, Helvetica, sans-serif; margin: 0 0 3px 12px; }
.searchBrowse .browse .content ul { margin: 0 0 6px 0; }
.searchBrowse .browse .content li a { font: 11px/12px Arial, Helvetica, sans-serif; vertical-align: middle; position: relative; left: -5px; }
.searchBrowse .browse .byProvince { background: url(browseBorder.png) right 25px no-repeat; width: 130px; padding: 0 0 20px 0; float: left; }
.searchBrowse .browse .byProvince ul { width: 120px; }
.searchBrowse .browse .byExperience { background: url(browseBorder.png) right 25px no-repeat; width: 150px; padding: 0 0 20px 14px; float: left; }
.searchBrowse .browse .byExperience ul { width: 140px; }
.searchBrowse .browse .byDate { width: 110px; padding: 0 0 0 14px; float: left; }
.searchBrowse .browse .byDate ul { width: 100px; }

/* Styles for Search and Browse component, internal or sub page variation */
.searchBrowseAreaSmall { height: 62px; width: 534px; float: right; position: relative; padding: 0 24px 0 0; z-index:999; }
.searchBrowseAreaSmall .searchTarget { height: 16px; width: 229px; margin: 0 0 0 21px; background: url(greenTargetCenter.png) top left repeat-x; float: left;  position: relative; padding: 19px 0 27px 0px; }
.searchBrowseAreaSmall .searchTarget .leftEnd { position: absolute; left: -21px; top: 0px; background: url(greenTargetLeft.png) right center no-repeat; height: 62px; width: 21px; }
.searchBrowseAreaSmall .searchTarget .rightEnd { position: absolute; right: -17px; top: 0px; background: url(greenTargetRight.png) left center no-repeat; height: 62px; width: 17px; }
.searchBrowseAreaSmall .searchTarget h3 { padding: 0 11px; height: 16px; font: bold 16px/16px Arial, Helvetica, sans-serif; color: #fff; text-shadow: #555 0px 1px 1px; }
.searchBrowseAreaSmall .browseTarget { height: 16px; width: 250px; margin: 0 0 0 21px; background: url(blueTargetCenter.png) top left repeat-x; float: right;  position: relative; padding: 19px 0 27px 0px; }
.searchBrowseAreaSmall .browseTarget .leftEnd { position: absolute; left: -17px; top: 0px; background: url(blueTargetLeft.png) right center no-repeat; height: 62px; width: 17px; }
.searchBrowseAreaSmall .browseTarget .rightEnd { position: absolute; right: -21px; top: 0px; background: url(blueTargetRight.png) left center no-repeat; height: 62px; width: 21px; }
.searchBrowseAreaSmall .browseTarget h3 { padding: 0 11px; height: 16px; font: bold 16px/16px Arial, Helvetica, sans-serif; color: #fff; text-shadow: #555 0px 1px 1px; }
.searchBrowseSmall { width: 565px; position: absolute; left: 0px; top: 10px; }
.searchBrowseSmall .search { width: 224px; background: url(greenCenterBgSmall.png) 0px 10px repeat-x; margin: 0 30px 0 60px; height: 266px; position: absolute; top: 0px; left: -16px; display: none; padding: 10px 0 0 0; z-index: 9999; }
.searchBrowseSmall .search .leftEnd { position: absolute; left: -60px; top: 0px; background: url(greenLeftBgSmall.png) 0px 10px no-repeat; width: 60px; height: 266px; padding: 10px 0 0 0; }
.searchBrowseSmall .search .rightEnd { position: absolute; right: -30px; top: 0px; background: url(greenRightBgSmall.png) 0px 10px no-repeat; width: 30px; height: 266px; padding: 10px 0 0 0; }
.searchBrowseSmall .search .content { position: absolute; left: -25px; top: 36px; width: 243px; height: 260px; }
.searchBrowseSmall .search .content h3 { font: bold 14px/16px Arial, Helvetica, sans-serif; color: #fff; text-shadow: none; margin: 6px 0 1px 0; }
.searchBrowseSmall .search .content .inputWrapper { border-top: 2px solid #959595; border-left: 1px solid #bdbdbd; border-right: 1px solid #d0d0d0; border-bottom: 1px solid #ececec; }
.searchBrowseSmall .search .content .inputWrapper2 { border-top: 1px solid #c6c6c6; border-left: 1px solid #e4e4e4; border-right: 1px solid #e3e3e3; border-bottom: 1px solid #f2f2f2; }
.searchBrowseSmall .search .content input { display: block; width: 100%; color: #666666; font: 11px/12px Arial, Helvetica, sans-serif; height: 12px; text-indent: 7px; padding: 2px 0; }
.searchBrowseSmall .search .content select { display: block; width: 100%; color: #666666; font: 11px/12px Arial, Helvetica, sans-serif; height: 18px; padding: 2px 0 2px 5px; }
.searchBrowseSmall .search .content p { color: #fff; font: 10px/12px Arial, Helvetica, sans-serif; padding: 4px 0; }
.searchBrowseSmall .browse { width: 358px; background: url(blueCenterBgSmall.png) 0px 10px repeat-x; margin: 0 124px 0 40px; height: 347px; position: absolute; top: 0px; right: 0px; display: none; padding: 10px 0 0 0; }
.searchBrowseSmall .browse .leftEnd { position: absolute; left: -40px; top: 0px; background: url(blueLeftBgSmall.png) 0px 10px no-repeat; width: 40px; height: 347px; padding: 10px 0 0 0; }
.searchBrowseSmall .browse .rightEnd { position: absolute; right: -124px; top: 0px; background: url(blueRightBgSmall.png) 0px 10px no-repeat; width: 124px; height: 347px; padding: 10px 0 0 0; }
.searchBrowseSmall .browse .content { width: 430px; padding: 0 26px; background: url(blueDivider.png) 0 24px no-repeat; position: absolute; left: -20px; top: 48px; color: #fff; font: 10px/12px Arial, Helvetica, sans-serif;  }
.searchBrowseSmall .browse .content a { color: #fff; }
.searchBrowseSmall .browse .content h4 { font: bold 14px/16px Arial, Helvetica, sans-serif; margin: 0 0 16px 0; }
.searchBrowseSmall .browse .content li { font: 8px/14px Arial, Helvetica, sans-serif; margin: 0 0 3px 12px; }
.searchBrowseSmall .browse .content ul { margin: 0 0 10px 0; }
.searchBrowseSmall .browse .content li a { font: 11px/12px Arial, Helvetica, sans-serif; vertical-align: middle; position: relative; left: -5px; }
.searchBrowseSmall .browse .byProvince { background: url(browseBorder.png) right 25px no-repeat; width: 130px; padding: 0 0 20px 0; float: left; }
.searchBrowseSmall .browse .byProvince ul { width: 120px; }
.searchBrowseSmall .browse .byExperience { background: url(browseBorder.png) right 25px no-repeat; width: 150px; padding: 0 0 20px 14px; float: left; }
.searchBrowseSmall .browse .byExperience ul { width: 140px; }
.searchBrowseSmall .browse .byDate { width: 110px; padding: 0 0 0 14px; float: left; }
.searchBrowseSmall .browse .byDate ul { width: 100px; }

/* Share, print and email component */
.sharePrintEmail { border-bottom: 1px solid #ccc; padding: 10px 0; }
.sharePrintEmail a { padding: 0 0 0 23px;  }
.sharePrintEmail .print { background:url(print.gif) center left no-repeat; }
.sharePrintEmail .email { background:url(email.gif) 18px center no-repeat; padding: 0 18px 0 18px; }
.sharePrintEmail .share { background:url(share.gif) center left no-repeat; display:block; position: relative; }
#shareComponent { position: absolute; top: 0px; left:0px; width: 150px; background: #fff; border: 1px solid #333; padding: 4px; list-style: none inside; margin:0; z-index:998; }
#shareComponent a { display: block; font: 10px/12px Verdana, Arial, Helvetica, sans-serif; padding: 4px 0 4px 20px; }
#shareComponent .delicious { background: url(delicious.png) left center no-repeat; }
#shareComponent .digg { background: url(digg.png) left center no-repeat; }
#shareComponent .facebook { background: url(facebook.gif) left center no-repeat; }
#shareComponent .myspace { background: url(myspace.png) left center no-repeat; }
#shareComponent .reddit { background: url(reddit.gif) left center no-repeat; }
#shareComponent .stumbleupon { background: url(su.png) left center no-repeat; }

.homeContent { font: 11px/13px Arial, Helvetica, sans-serif; color: #555555; }
.homeContent h2 a.panelHeader { color: #006993; font: bold 18px/18px Arial, Helvetica, sans-serif; }
.homeContent h2 { color: #006993; font: bold 18px/18px Arial, Helvetica, sans-serif; }

.careerNews { float: left; width: 230px; border-right: 1px dashed #555555; padding: 10px; margin: 10px 0; }
.careerNews a { display: block; font: 14px/18px Arial, Helvetica, sans-serif; margin: 18px 0 0 0; padding: 0 0 0 9px; background: url(bulletpoint.png) 0px 6px no-repeat; }
.careerNews a.panelHeader { background: none; margin: 0px; padding: 0px; }
.careerNews a.panelHeader:hover, .careerNews a.panelHeader:hover h2 { background: none; color: #000; }
.careerNews a:hover { background-image: url(bulletpointHover.png); }
.careerNews a.rss { background: url(rss.gif) 0 13px no-repeat; padding: 10px 0 10px 18px; }

.careerTips { width: 230px; float: left; padding: 10px 0px 0px 20px; margin: 10px 0; }
.careerTips h3 { font: bold 14px/18px Arial, Helvetica, sans-serif; border-bottom: 1px solid #000; color: #333; padding: 18px 0 0 0; margin: 0 0 10px 0; }
.careerVids h3 { font: bold 14px/18px Arial, Helvetica, sans-serif; border-bottom: 1px solid #000; color: #333; padding: 18px 0 0 0; }
.careerTips p { display: inline; }

.careerVids { width: 230px; float: left; padding: 20px 0px 10px 20px; margin: 10px 0; border-top: 1px dashed #555555; }
.careerVids p { padding: 10px 0; }
.careerVids .vidContainer { position: relative; width:261px; height: 156px; clear: both; background: url(vidBg.png) top left no-repeat; left: -12px; }
.careerVids .vidContainer a, .careerVids .vidContainer .youTube { width: 235px; height: 131px; display: block; position: absolute; left: 13px; top: 8px; }


.content .vidContainer { position: relative; width:522px; height: 314px; clear: both; background: url(vidBgLarge.png) top left no-repeat; left: -23px; }
.content .vidContainer a, .content .vidContainer .youTube { width: 472px; height: 264px; display: block; position: absolute; left: 25px; top: 15px; }
.vidThumbnail { float: right; padding: 10px 0 10px 10px; }

.itemsNav { position: relative; left: -8px; }
.itemsNav a { height: 12px; font: 12px/12px Arial, Helvetica, sans-serif; display: block; }
.itemsNav a.prevItem { background: url(prevButton.png) top left no-repeat; padding: 10px 0px 22px 28px; float: left;  }
.itemsNav a.prevItem:hover { background-image: url(prevButtonHover.png); }
.itemsNav a.nextItem { background: url(nextArrow.png) top right no-repeat; padding: 10px 28px 22px 0px; float: right;  }
.itemsNav a.nextItem:hover { background-image: url(nextArrowHover.png); }


/* Button style */
a.button { margin: 10px 17px; display:block; font: bold 20px/33px Arial, Helvetica, sans-serif; letter-spacing: 3px; padding: 0 16px; position: relative; background: url(buttonCenter.png) top left repeat-x; white-space: nowrap; height: 33px; color: #fff; cursor: pointer; text-transform: uppercase; text-align: center; }
a.button .leftend { position: absolute; left: -17px; top:0px; width: 17px; height: 33px; background: url(buttonLeft.png) top right no-repeat; }
a.button .rightend { position: absolute; right: -17px;  top:0px; width: 17px; height: 33px; background: url(buttonRight.png) top left no-repeat; }
a:hover.button { background-image: url(buttonCenterHover.png); color: #d7e2c1; text-decoration: none;}
a:hover.button .leftend { background-image: url(buttonLeftHover.png); }
a:hover.button .rightend { background-image: url(buttonRightHover.png); }


/* Small Button style */
a.smallButton .leftend , .rightend {display:block;}
a.smallButton { margin: 7px 12px; display:block; font: bold 14px/23px Arial, Helvetica, sans-serif; letter-spacing: 2px; padding: 0 10px; position: relative; background: url(buttonCenterSmall.png) top left repeat-x; white-space: nowrap; height: 23px; color: #fff; cursor: pointer; text-transform: uppercase; text-align: center; }
a.smallButton .leftend { position: absolute; left: -12px; top:0px; width: 12px; height: 23px; background: url(buttonLeftSmall.png) top right no-repeat; }
a.smallButton .rightend { position: absolute; right: -12px;  top:0px; width: 12px; height: 23px; background: url(buttonRightSmall.png) top left no-repeat; }
a:hover.smallButton { background-image: url(buttonCenterHoverSmall.png); color: #d7e2c1; text-decoration: none;}
a:hover.smallButton .leftend { background-image: url(buttonLeftHoverSmall.png); }
a:hover.smallButton .rightend { background-image: url(buttonRightHoverSmall.png); }


/* Footer style */
.footer { background: #004f79 url(footerBg.png) top left repeat-x; padding: 8px 20px 2px 20px; text-align: center; color: #fff; font: 10px/12px Arial, Helvetica, sans-serif; clear: both; }
.footer a { color: #fff; }
.footer .copyright { font: 9px/18px Arial, Helvetica, sans-serif; color: #000; }