/* Default Stylesheet for Nterchange Frontend */ /* ================================================== */ @import url(print.css) print; /*@import url("other_stylesheet.css") screen;*/ /* HTML RULES */ /* ================================================== */ body {color: #666666; font:13px/18px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; background: #f3f4f4 url(/images/layout/bg.png) top left repeat-x;} h1 { color: #323232; font: 36px/36px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; margin-bottom: 25px; font-weight: bold;} h2 { color: #fff; font: 27px/36px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;font-weight: bold; letter-spacing: -1px; margin: 0;} h3 { color: #323232; font: 20px/20px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; margin-bottom: 2px; font-weight: bold;} h4 { color: #323232; font: 20px/20px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; margin-bottom: 2px; font-weight: bold;} p { margin-bottom:10px; } a {color: #007cc3;} a:focus{outline:0;} a:hover {color: #007cc3;} a.inline_media{color:#666;text-decoration:none;} .multimediaelement{margin:10px 0 20px;} /* SITE LAYOUT RULES */ /* ================================================== */ #site {width: 965px; margin: 0 auto; position: relative; } #header {height: 130px; position: relative;} #logo {margin-left: 11px; margin-top: 15px;} #nav {height: 40px; background: url(/images/layout/nav_bg.png) top left no-repeat;} #utility_nav{position: absolute; top: 20px; right: 220px;} #utility_nav li{float: left; list-style: none; margin: 0; padding: 0; padding-left: 2px;} #utility_nav li a{font-size: 11px; color: #323232; text-decoration: none;} #search {position: absolute; top: 20px; right: 0px; height: 35px;} #search input{float: left;} #search span{display: block; float: left; margin-left: 3px; margin-top: -2px;} #masthead{display:block; padding:0 2px; margin-bottom:5px; position:relative; z-index:0; clear:both; height:1%; overflow:hidden; width:960px; height:300px;} #masthead ul, #masthead li { margin:0; padding:0; list-style:none; list-style-type:none; } #masthead ul.slides{/*width:960px; height:300px;*//*max-height:300px; _height:300px;*/ position:relative; /*overflow:hidden;*/ margin:0;} #masthead ul.slides li { left:0; top:0; } #masthead .masthead{display:block; width:960px; clear:both; position:relative; z-index:0; color:#fff; overflow:hidden; } #masthead .corner{position:absolute; width:12px; height:10px;} #masthead .top_left{top:-1px; left:-1px; background:url(/images/layout/masthead_top_left.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_top_left.png",sizingMethod="image");} #masthead .top_right{top:-1px; right:-1px; background:url(/images/layout/masthead_top_right.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_top_right.png",sizingMethod="image");} #masthead .bottom_left{bottom:-1px; left:-1px; background:url(/images/layout/masthead_bottom_left.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_bottom_left.png",sizingMethod="image");} #masthead .bottom_right{bottom:-1px; right:-1px; background:url(/images/layout/masthead_bottom_right.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_bottom_right.png",sizingMethod="image");} /* #masthead .masthead .corner{position:absolute; width:12px; height:10px;} #masthead .masthead .top_left{top:-1px; left:-3px; background:url(/images/layout/masthead_top_left.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_top_left.png",sizingMethod="image");} #masthead .masthead .top_right{top:-1px; right:-3px; background:url(/images/layout/masthead_top_right.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_top_right.png",sizingMethod="image");} #masthead .masthead .bottom_left{bottom:-1px; left:-3px; background:url(/images/layout/masthead_bottom_left.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_bottom_left.png",sizingMethod="image");} #masthead .masthead .bottom_right{bottom:-1px; right:-3px; background:url(/images/layout/masthead_bottom_right.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/masthead_bottom_right.png",sizingMethod="image");} */ #masthead .overlay{position:absolute; padding:20px 20px 20px 20px; background:url(/images/layout/masthead_overlay.png) top left repeat; _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/layout/masthead_overlay.png',sizingMethod='crop');} #masthead .overlay{text-align:right;font:34px/34px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; font-weight:bold;} #masthead .overlay_bottom{left:0; bottom:20px; width:920px;} #masthead .overlay_right{right:12px; bottom:15px; width:286px; font-size:24px; text-align:left;} #masthead .overlay blockquote{margin:0; color:#fff; font:36px/36px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; margin-bottom:15px; font-weight: bold;} #masthead .overlay cite{display: block; margin-bottom:15px;font: 22px/24px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; font-weight: normal; font-style: italic;} #heading{width:942px;background: #fff url(/images/layout/header_bg.png) top left no-repeat; height: 35px; padding-top: 5px; padding-left: 21px; padding-bottom: 33px; clear: both; } #heading h2{} #content {width:963px;background: #fff url(/images/layout/content_bg.png) top left repeat-y; float: left;} .wide #content{background-image:url(/images/layout/wide_content_bg.png);} .home #content{background-image:url(/images/layout/home_content_bg.png);} #main {} #main h2{color:#323232;} #main ol{margin-left:25px;} #side {margin-left: 11px;} #side h2{color:#323232;} #side h3{padding-left: 5px;} #side ul{margin: 0; padding: 0;} #side_navigation li{list-style: none; background: #e6e6e6; border-bottom: 1px solid #fff; margin: 0; } #side_navigation li a{color: #323232; text-decoration: none; font-weight: bold; font-size: 11px; padding: 2px 10px; display: block;} #side_navigation li li{background: #fff;} #side_navigation li li a{color: #007cc3; padding: 5px 0 5px 20px; background: url(/images/layout/side_nav_bullet.gif) 10px 12px no-repeat;} #side_navigation li li li a{color: #323232; padding:3px 0 3px 10px; margin-left:20px; background:none;} #side_navigation li li ul{margin-bottom:5px;} #side_navigation li li li li a{font-weight:normal; padding:3px 0 3px 10px; margin-left:40px;} #side_navigation li li li ul{margin-bottom:0px;} #side_navigation li.closed div{display:none;} #side_navigation li.active > a{color:#fff;background:#4F4C4D;} #side_navigation li a:hover{background-color:#DFDFDF;} #side_navigation li li a:hover{background-color:#EFEFEF;} #side_navigation li.active > a:hover{background:#4F4C4D;} #side #side_navigation{width:220px;margin-bottom:20px;} #altside {border-left: 1px solid #ccc;padding:0 7px 0 6px;width:218px;} #altside h2{color:#323232;} #footer { background: #f3f4f4 url(/images/layout/footer_bg.png) top left no-repeat; width:963px;} .wide #footer { background-image:url(/images/layout/wide_footer_bg.png);} #footer_nav {} #credits {} .pdf_block{} .pdf_block .pdf_link{float: left; margin-right: 5px;} .mediaelement_block{clear:both;} .mediaelement_block p{float:left;width:170px;} .mediaelement_block p .title{display:block;} .mediaelement_block .icon_link{float: left; margin-right: 5px;} #whats_new .mediaelement_blocks h4{clear:both;margin-bottom:5px;} /* BASIC CLASSES */ /* ================================================== */ .clear { display:block; clear:both; height:1px; line-height:1px; font-size:1px; } .img_left { float:left; } .img_right { float:right; } /* NAVIGATION RULES */ /* ================================================== */ #nav{background:transparent url(/images/nav/matrix.png) 0 0 no-repeat; display:block; clear:both; margin-bottom:12px; position:relative; z-index:100;} /* 1st level */ #nav ul{margin:0; padding:0; float:left; min-height:37px; width:100%; margin-left:10px; z-index:100;} #nav ul li{position:relative; float:left; list-style:none; margin:0; padding:0; margin-top:3px; padding-bottom:5px;} #nav ul li:hover,#nav ul li.hover{background:transparent url(/images/nav/matrix.png) -10px -41px no-repeat;} #nav ul li a{display:block; padding:5px 20px; height:25px; color:#666; font:12px/17px "Myriad Pro Bold Condensed", "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; text-transform:uppercase; font-weight:bold; text-decoration:none;} #nav ul li.current a{font-weight:bold;} #nav ul li a span{visibility:hidden; display:block; display:inline; width:100%; overflow:hidden;} /* 2nd level */ #nav ul ul{position:absolute; top:35px; left:-10px; z-index:90; width:200px; padding:3px 0 5px; background:transparent url(/images/nav/dropdown_shadow.png) bottom left no-repeat;} #nav ul ul li{width:100%; height:auto; margin:0; padding:0; float:left;} #nav ul ul li:hover,#nav ul ul li.hover{background:transparent;} #nav ul ul li a{width:160px; height:auto;} #nav ul ul li a:hover{color:#007cc3;} #nav ul ul li a span{visibility:visible;} /*#nav ul ul li a.parent span{padding-right:10px; background:transparent url(/images/layout/arrow.gif) no-repeat right 3px;}*/ #nav ul ul li a.parent .arrow{display:inline-block; width:10px; min-height:7px; line-height: 13px; height:100%; background:transparent url(/images/layout/arrow.gif) no-repeat right center;} /* 3rd level */ #nav ul ul ul{position:absolute; top:-3px; left:182px; z-index:80;} /* Hover navigation */ #nav ul li ul{display:none;} #nav ul li:hover ul,#nav ul li.hover ul{display:block;} #nav ul li:hover ul li ul,#nav ul li.hover ul li ul{display:none;} #nav ul li ul li:hover ul,#nav ul li ul li.hover ul{display:block;} #nav ul li ul li:hover ul li ul,#nav ul li ul li.hover ul li ul{display:none;} #nav ul li ul li ul li:hover ul,#nav ul li ul li ul li.hover ul{display:block;} #nav ul li ul li ul li:hover ul li ul,#nav ul li ul li ul li.hover ul li ul{display:none;} /* Hover highlighting */ #nav ul li li:hover a,#nav ul li li.hover a{color:#007cc3;} #nav ul li li:hover li a,#nav ul li li.hover li a{color:#666;} #nav ul li li li:hover a,#nav ul li li li.hover a{color:#007cc3;} #nav ul li li li:hover li a,#nav ul li li li.hover li a{color:#666;} #nav ul li li li li:hover a,#nav ul li li li li.hover a{color:#007cc3;} /* Tweaks for each one */ #nav ul li#navitem_about-cnq{width:96px;} #nav ul li#navitem_about-cnq:hover,#nav ul li#navitem_about-cnq.hover{background-position:-10px -41px;} #nav ul li#navitem_operations{width:110px;} #nav ul li#navitem_operations:hover,#nav ul li#navitem_operations.hover{background-position:-106px -41px;} #nav ul li#navitem_corporate-responsibility{width:194px;} #nav ul li#navitem_corporate-responsibility:hover,#nav ul li#navitem_corporate-responsibility.hover{background-position:-216px -41px;} #nav ul li#navitem_investor-information{width:174px;} #nav ul li#navitem_investor-information:hover,#nav ul li#navitem_investor-information.hover{background-position:-410px -41px;} #nav ul li#navitem_media-center{width:121px;} #nav ul li#navitem_media-center:hover,#nav ul li#navitem_media-center.hover{background-position:-584px -41px;} #nav ul li#navitem_media-center ul ul{left:-202px;} #nav ul li#navitem_careers{width:93px;} #nav ul li#navitem_careers:hover,#nav ul li#navitem_careers.hover{background-position:-705px -41px;} #nav ul li#navitem_careers ul ul{left:-202px;} #nav ul li#navitem_working-together{width:158px;} #nav ul li#navitem_working-together:hover,#nav ul li#navitem_working-together.hover{background-position:-798px -41px;} #nav ul li#navitem_working-together ul{left:-48px;} #nav ul li#navitem_working-together ul ul{left:-202px;} #nav ul li#navitem_oil-sands-mining div li a {font-size:11px;line-height:12px;text-transform:none;} #nav ul li div li a {font-size:11px;line-height:12px;text-transform:none;} .nav_horiz {} .nav_horiz ul {margin: 0; padding: 0;} .nav_horiz ul li { float:left; list-style: none; margin: 0; padding: 0;} /* SEARCH */ /* ================================================== */ #search form {} #search form input.text {} #search form input.button {} #searchresults dd { margin-bottom:5px; } #searchresults dl { margin-top:15px; } /* HOMEPAGE OVERRIDES */ /* ================================================== */ #page-home{background: #f3f4f4 url(/images/layout/bg_home.png) top left repeat-x;} .home {} .home #heading{padding-bottom: 0;} .home #content{position:relative;} .home #main, .home .home_block{position:relative;z-index:30;} #whats_new_top{position:absolute; z-index:20; top:0px; left:0px; width:965px; height:100px; background:url(/images/layout/whats_new_top.png) top left no-repeat; _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/layout/whats_new_top.png",sizingMethod="image");} #whats_new{position:relative; z-index:50; overflow:hidden; padding: 20px 0px 30px 20px; background: url(/images/layout/whats_new_bg.png) bottom left no-repeat; font-size:10px;} #whats_new h3{ clear:both; color: #007cc3;font: 22px/28px "Myriad Pro Bold", "Myriad Pro", "Myriad", "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; margin-bottom: 10px; font-weight: bold;} #whats_new h4{font-size: 14px; font-weight: bold; margin-bottom:0; padding-bottom:0; color:#555555; height:auto;} #whats_new p a{text-decoration: none; color: #323232; font-weight:bold;} #whats_new .text{padding-right:20px;} .home_link_description {margin-bottom:10px;} #home_footer{display: block; width:930px; padding:20px 15px 0; overflow:hidden; font-size: 10px; } #home_footer_contact{width:300px;padding:0;margin:0;} #home_footer_nav{width:630px;padding-bottom:40px;margin-right:-4px;float:right; } #home_footer_nav ul{float:right;} #home_footer_nav li{padding-right:4px;} #home_footer_nav a{text-decoration: none; border-left:1px solid #3094CE; font-size:10px; padding-left:4px;} #home_footer_nav li.first a{border-left-width:0; padding-left:0;} #footer_legal{border-top:1px solid #E4E4E4; margin-top:10px;padding:10px 0;font-size:10px;} #footer_legal .copyright{float:left;} #footer_legal .links{float:right;} #footer_legal a{color:#5B5B5B; text-decoration:none;} #whats_new .stock_symbol{font-size:14px; font-weight:bold; margin:0 20px 10px 0; padding:0 4px 10px 0; border-bottom:1px solid #D5D5D5; color:#555555; height:auto;} #whats_new .stock_feed{padding-bottom:8px; margin:0 20px 8px 0; border-bottom:1px solid #D5D5D5;} #whats_new .stock_feed span{font-size:13px; font-weight:bold; margin-bottom:0; padding:0 4px 0 0; color:#555555; height:auto;} #whats_new .stock_feed .stock_change{background-repeat:no-repeat; background-color:transparent; padding-left:10px; margin-left:5px;} #whats_new .stock_feed .stock_change_up{color:#3BB578; background-image:url(/images/layout/stock_up.gif); background-position:0px 3px;} #whats_new .stock_feed .stock_change_down{color:#DF2930; background-image:url(/images/layout/stock_down.gif); background-position:0px 4px;} #whats_new .stock_feed .stock_date{display:block; clear:both; font-size:11px; font-weight:normal; color:#575757; padding:2px 0;} table{width:100%;} th{background:none;font-weight:normal;text-align:left;border-bottom:1px dotted #6D6D6D;} td{text-align:right;border-bottom:1px dotted #6D6D6D;} tr.main th, th.main{font-weight:bold;vertical-align:bottom;} tr.main th *, th.main *{font-weight:normal;} tr.top th, tr.top td{text-align:right;border-bottom:1px solid #6D6D6D;} tr.bottom th, tr.bottom td{border-bottom:1px solid #6D6D6D;} tr.thick_bottom th, tr.thick_bottom td{border-bottom:2px solid #6D6D6D;} th.indent, td.indent{padding-left:25px;} th.highlight, td.highlight{background:#E6E6E6;font-weight:bold;border-right:1px solid #6D6D6D;} table.left th, table.left td, tr.left td, tr.left th, table.right tr.left td, table.right tr.left th, td.left, th.left, table.right td.left, table.right th.left{text-align:left;} table.right th, table.right td, tr.right td, tr.right th, table.left tr.right td, table.left tr.right th, td.right, th.right, table.left td.right, table.left th.right{text-align:right;} .footnotes{font-size:11px;font-size:9px;margin-left:30px;} dl{margin:-5px 0 10px;} dl dt{padding-top:5px;} dl dd{margin-bottom:5px;} #side dl{margin-top:0;} #side dl dt{clear:left;float:left;font-weight:bold;padding:5px 0;width:50px;border-top:1px dotted #666;} #side dl dd{float:left;padding:5px 0 0 5px;margin:0;width:160px;border-top:1px dotted #666666;} #altside dl{margin:-5px 0 10px;} #altside dl dt{padding-top:5px;} #altside dl dd{margin-bottom:5px;} /* BODY IMAGES */ /* ================================================== */ .bodyimage{margin-bottom:10px;} .bodyimage .image{position:relative;} .bodyimage .image .magnify{display:block;width:26px;height:26px;position:absolute;right:5px;bottom:10px;background:transparent url(/images/layout/magnify.png) no-repeat;_background-image:none;filter:progid:dximagetransform.microsoft.alphaimageloader(src='images/layout/magnify.png',sizingmethod='none');} .bodyimage .border{padding:10px 0;text-align:center;background:white;} .bodyimage .shadow{position:relative;padding:0 14px 15px 0;background:url(/images/layout/shadow_dark_bottom_right.gif) no-repeat right bottom;} .bodyimage .shadow .shadow_top{position:absolute;width:14px;height:20px;top:0px;right:0px;background:url(/images/layout/shadow_dark_top_right.gif) no-repeat;} .bodyimage .shadow .shadow_bottom{position:absolute;width:20px;height:18px;bottom:0px;left:0px;background:url(/images/layout/shadow_dark_bottom_left.gif) no-repeat;} .bodyimage .shadow .magnify{right:10px;bottom:15px;} #side .bodyimage .shadow{background-image:url(/images/layout/shadow_light_bottom_right.gif);} #side .bodyimage .shadow .shadow_top{background-image:url(/images/layout/shadow_light_top_right.gif);} #side .bodyimage .shadow .shadow_bottom{background-image:url(/images/layout/shadow_light_bottom_left.gif);} .bodyimage h2{margin:0 15px 15px;} .bodyimage .small_description{padding:5px;} .bodyimage .small_description .footnotes{font-size:9px;text-align:right;} .large_description{min-width:800px;_width:800px;padding:10px 10px 50px;background:#333;} .large_description *{line-height:1;} .large_description th {border-bottom:2px solid #ccc;font-weight:700;} .large_description td {border-bottom:1px solid #ddd;padding:5px 10px 5px 0;} .large_description th {padding:5px 10px 5px 0;} .large_description tfoot {font-style:italic;} .large_description caption {background:#ffc;} .large_description table .last {padding-right:0;} /* MEDIA ELEMENTS */ /* ================================================== */ .mediaelement h3{margin-top:10px;} .media_content{/*min-width:800px;_width:800px;*/ padding:10px 10px 50px;background:#333;text-align:center; height:95%;} .media_content *{line-height:1;} .media_content th {border-bottom:2px solid #ccc;font-weight:700;} .media_content td {border-bottom:1px solid #ddd;padding:5px 10px 5px 0;} .media_content th {padding:5px 10px 5px 0;} .media_content tfoot {font-style:italic;} .media_content caption {background:#ffc;} .media_content table .last {padding-right:0;} form .grid dl {float:left;width:50%;} form .grid dl input{width:250px;} form .grid dl select{width:250px;} #agm_dinner_form .grid dl{float:left;width:50%;} #agm_dinner_form .grid input{width:250px;} #agm_dinner_form .grid select{width:250px;} #agm_dinner_form textarea{width:580px;height:100px;} #open_house_form .grid dl{float:left;width:50%;} #open_house_form .grid input{width:250px;} #open_house_form .grid select{width:250px;} #open_house_form textarea{width:580px;height:100px;} #information_request_form #contact_fields dl{float:left;width:50%;} #information_request_form #contact_fields input{width:250px;} #information_request_form #contact_fields select{width:250px;} #information_request_form textarea{width:580px;height:100px;} #disclaimer_form dl{float:left;} #disclaimer_form dt{display:none;} #disclaimer_form dd{margin:5px 20px 5px 0;} #lightwindow .form *{line-height:1;} #lightwindow .form textarea{height:100px;} #lightwindow .form_header{background:#007CC3;padding:5px;font-size:20px;font-weight:bold;color:white;} #email_form_submission_form{margin:0 0 0 20px;padding-bottom:100px;} #email_form_submission_form textarea{height:100px;} .email_form{padding:5px 0;} .email_form a{background:url(/images/layout/email.gif) left top no-repeat; padding:0 0 0 25px;} #popup{background: #fff;} #popup #heading{width: auto;} #popup #content{width: 100%; min-height: 300px; _height: 300px;} .event_detail{margin: 20px; margin-top: 0;} /* CUFON */ /*.js h1, .js h2, .js h3, .js #banner blockquote, .js #banner cite{visibility:hidden;}*/ .directors dt span{display:inline-block;width:10px;text-align:center;} .related_links {background:url(/images/layout/related_links.gif) top left no-repeat;padding-top:45px;} .related_links h2{color:#323232;} .related_links ul{margin: 0; padding: 0;} .related_links li{list-style: none; background:transparent; border-bottom:1px solid #fff; margin:0;} .related_links li a{display:block; font-weight:bold; font-size:11px; text-decoration:none; color: #007cc3; padding: 2px 0 2px 20px; background: url(/images/layout/side_nav_bullet.gif) 10px 9px no-repeat;} .blue{color:#007CC3;} .green{color:#009900;} .red{color:#ff0000;} #lightwindow_contents{overflow:hidden !important;} .calendar_event{margin-bottom:20px;}