/* Global reset */ /* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */ *, html, body, div, dl, dt, dd, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 } table { border-collapse:collapse; border-spacing:0 } fieldset, img { border:0 } address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal } caption, th { text-align:left } h1, h2, h3, h5, h5, h6 { font-size:100% } q:before, q:after { content:''} /* Global reset-RESET */ /* The below restores some sensible defaults */ strong { font-weight: bold } em { font-style: italic } ol, ul, li { list-style:none } * a { position:relative } /* Gets links displaying over a PNG background */ a { outline:none; under} /* Gets rid of Firefox's dotted borders */ a img { border:none } /* Gets rid of IE's blue borders */ /* sIFR settings */ /* These are standard sIFR styles... do not modify */ .sIFR-flash {visibility: visible !important; margin: 0; z-index:0;} .sIFR-replaced {visibility: visible !important; z-index:0;} span.sIFR-alternate {position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; z-index:0;} /* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */ .sIFR-hasFlash -feature_video_title {visibility: hidden;} /* SIMPLE SETTINGS ----- */ html,body {font-size: 10pt; color:#333; height: 100%; background-color: #fff; font-family: Arial, Helvetica, sans-serif;} img {border: 0;} h1, h2, h3, h4, h5, h6 {color: #49166D;} .clear {clear:both;} .btn {background:#b2e57f; color:#333; font-size:12px; font-weight:bold; border: 1px solid #6c0; padding:0px; -moz-border-radius:4px; margin-left:20px; margin-top:4px; } a {text-decoration:none} a:hover { text-decoration:underline} /* LAYOUT ----- */ #wrapper {margin: 0 auto; width:950px; position:relative;} #content { clear:both; margin: 0px 25px 30px 0px; width: 665px; float: left; position:relative} #leftcolumn { clear:both; background:url(../images/bg_charts.gif) repeat-y; margin: 0px 5px 30px 0px; width: 215px; float: left;} #leftmiddle { background:url(../images/bg_charts.gif) repeat-y; min-height:300px; margin: 0px 9px 30px 0px; width: 215px; float: left;} #rightmiddle { margin: 0px 5px 30px 0px; width: 245px; float: left;} #rightcolumn { margin: 0px 0px 30px 0px; width: 245px; float: left;} #footer { background:url(../images/bg_footer.gif) repeat-x; clear: both; height:100px;width:100%; margin-top:30px;} #disclaim { margin-top:20px; text-align:right} /* HEADER */ #TelusNav {text-align:left;} .crumb {font-size: 11px; padding: 3px 0px 3px 0px;} .crumb a {color: #49166d;} #header { width:950px; margin-top:30px; margin-bottom:0px;height:44px;} #header a {float:left } #header form { float:right; margin-top:20px} #header input.searchbox { border: 1px solid #49166d; font-size: 11px; padding:2px; width: 200px;} #header input.searchsubmit {background:#b2e57f; color:#333; font-size:12px; font-weight:bold; border: 1px solid #6c0; padding:0px; } #topnav {clear:both} #navlist {list-style: none;padding: 0;margin:10px 0 20px 0;} #navlist li{display: inline;padding: 0;margin: 0;} #navlist li:before { content: "| "; color:#959595} #navlist li:first-child:before { content: ""; } #navlist li a {color:#959595; text-decoration:none;padding: 0 0.4em 0 0.4em;margin: 0 0.4em 0 -0.4em;} #navlist li a:hover {color:#959595; text-decoration:underline;} #navlist li.last a {color:#66cc00} /*IE workaround*/ /*All IE browsers*/ * html #navlist li{border-left: 1px solid #959595;padding: 0 0.4em 0 0.4em;margin: 0 0.4em 0 -0.4em;} /*Win IE browsers - hide from Mac IE\*/ * html #navlist { height: 1%; } * html #navlist li {display: block;float: left;} /*End hide*/ /*Mac IE 5*/ * html #navlist li:first-child { border-left: 0; } span.stars_total {color:#bbb; font-size:11px; font-weight:normal} /* FEATURE */ #feature { width:950px; height:340px; } #feature_img {float:left; text-align:right; margin-right:15px} #feature img#screencap { height:270px;} #feature_text { float:left;height:340px; text-align:left; width:430px} #feature div.title {height:50px; font-size:36px; color:#49166d; float:left;} #feature div.com {height:12px; width:40px; margin-left:5px;margin-top:30px; float:left;} #feature div.com a {font-size:12px; color:#000000;} #feature_date { font-size:14px; color:#bbb;clear:both;} #feature table {width:225px; height:100px; float:right;} #feature td {vertical-align:middle;} ul.markers {list-style-type: square; list-style-image: url(../images/square_bullet_green.gif); font-size:12px; color:#000000; text-align:left; margin-left:10px; padding-left:10px;} ul.markers li.mark {list-style-type: square; list-style-image: url(../images/square_bullet_green.gif); font-size:12px; color:#000000; text-align:left;} #feature_stars {width:80px; height:17px; margin-top:25px} #feature_length {height:17px; margin-top:35px; width:200px; font-size:14px; color:#bbb;} #feature_controls {margin-top:30px; text-align:center;} #feature_controls img {} /* CHARTS */ #charts {width:195px; padding:5px 10px;} #charts ul li {font-weight:bold; margin-bottom:10px;} #charts ul li a {text-decoration:none; color:#545454;} #charts ul li a:hover {text-decoration:underline; color:#545454;} #charts ul li ul li{font-weight:normal; font-size:10px; margin:0 0 -3px 15px; color:#777;} /* RECENT */ #recent_date { font-size:12px; color:#bbb; margin:10px 0;} div.recent div.title {font-size:20px; color:#49166d; font-weight:normal;} div.recent span.com a {font-size:12px; color:#000000; font-weight:normal; margin-left:5px;} div.recent recent_img {} div.recent img#screencap {} div.recent ul.markers { margin-top:10px;} div.recent #recent_stars {} div.recent div.home {margin-top:15px} /* CONTENT PAGES */ #content h1 {font-size:24px; color:#49166d; width:665px; border-bottom:1px solid #66cc00; margin-bottom:20px;} #content h2 {font-size:22px; color:#49166d; width:665px; margin:5px 0;} #content p {margin-bottom:12px;} #content a:link, #content a:active, #content a:visited {color: #49166d; background-color: transparent; text-decoration: none; font-weight:bold; margin:5px 0; } #content a:hover {text-decoration: underline; font-weight:bold;} #content ul.about {} #content ul.about li{ margin-bottom:5px;} #content ul.about li.indent{ padding-left:47px;} div.row { clear: both; padding-top: 5px;} span.label { float: left; width: 160px; text-align: right; color:#49166d;} span.formw { float: right; width: 450px; text-align: left;} .tooltips { display: none; width:120px; z-index:10000; border:1px solid #66cc00; padding: 10px 10px 25px 10px; background:#ffffff; filter: alpha(opacity=90);text-align:left;} .tooltips_big { display: none; width:500px; z-index:10000; border:1px solid #66cc00; padding: 15px 5px 5px 10px; background:#ffffff; filter: alpha(opacity=90); text-align:left;} #helper_criteria { position: absolute; top:60px; left:150px; background:url(../images/close_window_#lang#.gif) no-repeat top right #FFF;} #helper_costcentre { position: absolute; top:400px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} #helper_storyfocus { position: absolute; top:470px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} #helper_audience { position: absolute; top:650px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} #helper_interview { position: absolute; top:755px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} #helper_interview2 { position: absolute; top:765px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} #helper_video { position: absolute; top:1000px; left:180px; background:url(../images/close_window_#lang#.gif) no-repeat bottom right #FFF;} .helper_close {font-size:10px; padding:1px; cursor: pointer} .tooltips_big h3 { color: #49166D; font-size:20px;} .tooltips h1 { color: #49166D; font-size:14px; font-weight:bold;} .tooltips_big h4 { color: #66cc00; font-size:16px;} .tooltips h2 { color: #66cc00; font-size:12px;} /* SEARCH PAGE */ #searchbox { width:600px; padding:10px 10px 0 10px; background:#b2e57f; margin:10px 0 30px 0;} #searchbox input.textbox{ border: 1px solid #b2e57f; font-size: 14px; width: 500px; height:19px} #searchbox select{ font-size: 14px} #searchbox .btn { background:#6c0; color:#333; font-size:11px; font-weight:bold; border: 1px solid #fff; margin-left:-5px; margin-bottom:1px} #searchresultbox { border-bottom: 1px solid #555; padding-top:10px; padding-bottom:15px;} table#searchresults { width:620px; } table#searchresults td.image {width:160px;} table#searchresults td.title {} table#searchresults td.title a.title {font-size:18px; color:#49166d;font-weight:normal;} table#searchresults td.title span.com {margin-left:5px;margin-top:5px;} table#searchresults td.title span.com a {font-size:10px; color:#000000;font-weight:normal;} table#searchresults td.info {width:200px; color:#ccc; font-size:11px;} table#searchresults td.markers li.search { font-size:11px} table#searchresults td.links ul { margin-top:15px;} table#searchresults td.links li { float:left; color:#555; margin-right:5px; } table#searchresults td.links a { color:#49166d; font-weight:normal} table#searchresults td.links a:visited { color:#49166d; font-weight:normal} table#searchresults td.links a:active { color:#49166d; font-weight:normal} table#searchresults td.links a:hover { color:#49166d; font-weight:normal} /* COMMENTS */ #commentboxes table {width:100%; border:2px solid #f2f2f2;} #commentboxes table td { padding:30px 20px;} #commentboxes table td.counter { color:#545454; font-size:24px; font-weight:normal; text-align:center; width:75px;} #commentboxes table td.submitter { color:#49166d; font-size:18px; font-weight:bold; text-align:left; width:200px;} #commentboxes table td.submitter span { color:#545454; font-size:10px; font-weight:normal;} #commentboxes table td.comment { color:#545454;} #commentboxes table td.comment label { color:#555; font-size:12px; font-weight:bold; margin-bottom:5px;} #commentuserform {width:660px; border:2px solid #f2f2f2; background:#f2f2f2; display:none;margin:10px 0} #commentuserform label { text-align:right;margin-right:4px;} #commentuserform input {width: 70px; font-size:10px;} #commentuserform select, #commentuserform option{font-size:10px;} /************* START Cast Navigation for Personalities *****************/ div#castNavWrapper {width:665px;margin-bottom:17px;padding:0px;position:relative;z-index:5;} div#castNavWrapper a, div#castNavWrapper a:link, div#castNavWrapper a:active, div#castNavWrapper a:visited { display:block;float:left;width: 54px;text-decoration: none;padding:2px 0px;margin-right:1px;} div#castNavWrapper a.blackTribe:hover { text-decoration: none;background-color: #bbb;} .castNameContainer {font-family:Arial, Helvetica, sans-serif;font-size:13px;font-weight:700;position:absolute;color: #49166d;top:-24px; line-height:24px;background-color:#fff;text-align:center;height:24px;padding-left:9px;background:transparent url(../images/tooltip-left.gif) top left no-repeat scroll; white-space:nowrap;} div.castNameContainer span {background:transparent url(../images/tooltip-right.gif) top right no-repeat scroll; height:24px; padding-right:9px;} div#castNavWrapper #name0 { left:0px; top:-19px;} div#castNavWrapper #name1 { left:55px; top:-19px;} div#castNavWrapper #name2 { left:110px; top:-19px;} div#castNavWrapper #name3 { left:165px; top:-19px;} div#castNavWrapper #name4 { left:220px; top:-19px;} div#castNavWrapper #name5 { left:275px; top:-19px;} div#castNavWrapper #name6 { left:330px; top:-19px;} div#castNavWrapper #name7 { left:385px; top:-19px;} div#castNavWrapper #name8 { left:440px; top:-19px;} div#castNavWrapper #name9 { left:495px; top:-19px;} div#castNavWrapper #name10 { left:550px; top:-19px;} div#castNavWrapper #name11 { left:605px; top:-19px;} .hideIt { visibility:hidden !important;} .showIt { visibility:visible !important;} div#hostcontainer img.host {margin:10px 10px 0 0; float:right; border:3px solid #ccc;} div#hostcontainer h3 {font-size:22px; color:#49166d; margin:10px 0;} div#hostcontainer span.hostTitle {font-size:14px; color:#333; margin:0 10px 10px 0;} div#hostcontainer span.hostCity {font-size:14px; color:#333; margin:0 10px 10px 0;} div#hostcontainer div#pullQuote {margin:35px 0;font-family:Arial, Helvetica, Georgia;font-size: 20px;line-height:20px; color:#333;} div#hostcontainer label { font-weight:bold; } /************* Sifr decoys *****************/ .sIFR-hasFlash #feature div.title { visibility: hidden; } .sIFR-hasFlash #content h1 { visibility: hidden;} .sIFR-hasFlash #content h2 { visibility: hidden; } .sIFR-hasFlash #player_title { visibility: hidden; } .sIFR-hasFlash #links_title { visibility: hidden; }