/* ------------------------------ Canadian Tire - Main CSS Last Updated: September 15, 2006 ------------------------------ */ @import "header.css"; /* August 23 */ @import "nav.css"; /* August 23 */ @import "footer.css"; /* August 23 */ @import "products.css"; /* August 24 */ @import "checkout.css"; /* August 21 */ @import "postalcode.css"; /* August 21 */ @import "registration.css"; /* August 24 */ @import "customer_info.css"; /* August 21 */ @import "store_locator.css"; /* August 24 */ @import "inventory.css"; /* August 21 */ @import "large_images.css"; /* August 23 */ /* ----------------- LAYOUT ----------------- */ html, body { width: 100%; margin: 0; padding: 0; background: #ffffff; font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 10px; text-align: center; } #container { width: 760px; margin: 0 auto; text-align: left; } #header { width: 760px; margin: 0 0 8px 0; } #sidebar_left { clear: both; float: left; width: 145px; } #sidebar_left a, #sidebar_right a { text-decoration:underline !important;} #content { float: left; width: 440px; padding: 0 0px 10px 10px; margin-top:7px; } #content_wide { float: left; width: 605px; padding: 0 0 10px 10px; margin-top:7px; } * html #content_wide { width: 600px; padding: 0 0 10px 10px; } #content_full { width: 760px; padding: 10px 0 10px 0; margin-top:7px; } #sidebar_right { float: right; width: 155px; margin: 0 0 0px 0;} /* Add the IDs for bypassing activeX control */ #sidebar_right0 { } #sidebar_right1 { } #sidebar_right2 { } #sidebar_right3 { } #sidebar_right4 { } #sidebar_right5 { } #content0 { } #content1 { } #content2 { } #content3 { } #content4 { } #content5 { } #footer { clear: both; width: 760px; padding-top:15px; } .breadcrumbs { position:relative; top:-6px; margin-bottom:5px;} .breadcrumbs a {text-decoration: underline;} .pad { padding: 1px 17px; margin-top:0px;} .toppad { padding: 10px 0 0 0; } .clear { clear: both; } .column { width: 50%; float: left; } .column_4wide { width: 25%; float: left; } .column_5wide { width: 20%; float: left; } .highlightbox_1 { margin: 0 0 15px 0; width: 440px; background: url('/media/images/global/global_highlightbox_1_bg.gif') repeat-y; } .highlightbox_1_top { height: 12px; background: url('/media/images/global/global_highlightbox_1.gif') no-repeat; } .highlightbox_1_bottom { clear: both; height: 12px; background: url('/media/images/global/global_highlightbox_1.gif') bottom no-repeat; } .highlightbox_1a { margin: 0 0 15px 0; width: 300px; background: url('/media/images/global/global_highlightbox_1a_bg.gif') repeat-y;} .highlightbox_1a_top { height: 15px; background: url('/media/images/global/global_highlightbox_1a.gif') no-repeat; } .highlightbox_1a_bottom { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1a.gif') 0 bottom no-repeat;} .highlightbox_1a_bottom_alt { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1a_alt.gif') 0 bottom no-repeat; } .highlightbox_1b { margin: 0 0 15px 0; width: 760px; text-align: left; background: url('/media/images/global/global_highlightbox_1b_bg.gif') repeat-y;} .highlightbox_1b_top { height: 15px; background: url('/media/images/global/global_highlightbox_1b.gif') no-repeat; } .highlightbox_1b_bottom { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1b.gif') 0 bottom no-repeat;} .highlightbox_1b_bottom_alt { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1b_alt.gif') 0 bottom no-repeat; } .highlightbox_1c { margin: 0 0 15px 0; width: 600px; text-align: left; background: url('/media/images/global/global_highlightbox_1c_bg.gif') repeat-y; } .highlightbox_1c_top { height: 15px; background: url('/media/images/global/global_highlightbox_1c.gif') no-repeat; } .highlightbox_1c_bottom { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1c.gif') 0 bottom no-repeat;} .highlightbox_1c_bottom_alt { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_1c_alt.gif') 0 bottom no-repeat; } .highlightbox_3 { margin: 0 0 15px 0; width: 380px; text-align: left; background: url('/media/images/global/global_highlightbox_3_bg.gif') repeat-y; voice-family: "\"}\""; voice-family:inherit; margin: 0 0 15px 0; width: 370px; text-align: left; background: url('/media/images/global/global_highlightbox_3_bg.gif') repeat-y;} .myCTAccountBox {width: 370px; height: 180px; background: url('/media/images/global/myCT_370x180.jpg') no-repeat;} .logInBox {width: 370px; height: 195px; background: url('/media/images/global/signup_box_370x195.jpg') no-repeat;} .signInButton1 {float: right; position:relative; right:385px;} .signInButton2 {float: right; position:relative; margin-right: -5px; margin-top: -29px;} .account_info {margin-left:10px; margin-top:25px;} .highlightbox_3_top { height: 15px; background: url('/media/images/global/global_highlightbox_3.gif') no-repeat; } .highlightbox_3_bottom { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_3.gif') 0 bottom no-repeat; } .highlightbox_3_bottom_alt { clear: both; height: 15px; background: url('/media/images/global/global_highlightbox_3_alt.gif') 0 bottom no-repeat; } .boxbutton, .boxbuttonround { float: right; margin: -15px 0 0 0; position:relative; left:5px; } .boxbuttonFix { left:-1px; } .boxbuttonFix2 { margin-left:-14px;} * html .boxbuttonFix2 { left:288px;} .boxbuttonFix3 { left:0;} * html .boxbuttonFix3 { left: 15px; voice-family: "\"}\""; voice-family:inherit; left:5px;} .boxbuttonFix4 { left: -5px; voice-family: "\"}\""; voice-family:inherit; left:5px; } .boxbuttonFloatLeft { position:relative; left:288px; } .boxbuttonFloatLeft-two { margin-left:190px; } * html .boxbuttonFloatLeft-two { margin-left:94px; position:relative; top:25px; top:15px;} .boxbuttonFloatLeft3 { margin-left:207px;} * html .boxbuttonFloatLeft3 { margin-left:103px; postion:relative; top:13px; top: 3px;} p.required_note, .required { font-size:11px;} .required b { font-size:15px; background: #e62f1a; color: #FFF; padding: 0px 1px 0px 1px} p.note_form { width:200px; position:relative; left:129px;} * html p.note_form { left:130px;} .eflyer_boxbutton { float: right; clear: right; margin: -15px -5px 0 0; } #eflyer_img { margin-top:5px;} * html #eflyer_img { margin-top:-5px;} a.boxbutton_link, a.boxbutton_link:visited { margin: 0 5px 0 0; /* IE5 HACK */ float: left; height: 40px; position:relative; left:0px; padding: 3px 37px 0 0; font-family: Arial Black, Arial, sans-serif; font-size: 11px; text-transform: uppercase; text-align: right; color: #ffffff; border: none; background: url('/media/images/global/global_boxbutton.gif') right 0 no-repeat; cursor: pointer; voice-family: "\"}\""; voice-family:inherit; float: left; height: 25px; margin: 0 5px 0 0; position:relative; left:0px; padding: 3px 37px 0 0; font-family: Arial Black, Arial, sans-serif; font-size: 11px; text-transform: uppercase; text-align: right; color: #ffffff; border: none; background: url('/media/images/global/global_boxbutton.gif') right 0 no-repeat; cursor: pointer;} * html body .boxbutton_link, * html .boxbutton_link:visited { left:5px; left: 0px;} .boxbutton_link:hover { text-decoration: none; } div.boxbutton_left { float: left; margin: 0; width: 12px; height: 24px; background: url('/media/images/global/global_boxbutton_left.gif') bottom no-repeat; } * html body div.boxbutton_left { position:relative; left:2px; } a.boxbuttonround_link, a.boxbuttonround_link:visited { float: left; height: 40px; margin: 0 5px 0 0; position:relative; left:0px; padding: 6px 37px 0 0; font-family: Arial Black, Arial, sans-serif; font-size: 11px; text-transform: uppercase; text-align: right; color: #ffffff; border: none; background: url('/media/images/global/global_boxbuttonround.gif') right 0 no-repeat; cursor: pointer;} * html body .boxbuttonround_link, * html .boxbuttonround_link:visited { left:5px; } .boxbuttonround_link:hover { text-decoration: none; } div.boxbuttonround_left { float: left; margin: 0; width: 12px; height: 27px; background: url('/media/images/global/global_boxbuttonround_left.gif') bottom no-repeat; } * html body div.boxbuttonround_left { position:relative; left:2px; } .pagination { margin: 9px 0 0 0; padding: 0 15px 0 0; text-align: right; } .pagination_bottom { margin: 9px 0 9px 0; } .pagination a, .pagination strong { margin-right:7px;} div#home_ads { margin-top: -7px;} /* ----------------- TYPOGRAPHY ----------------- */ #content, #content_wide, #content_full { color: #565656; } p { margin: 0 0 12px 0; } .highlightbox_1 p { margin: 0; padding: 0 10px 0 10px; font-size: 9px; } .highlight { color: #e62f1a;} .hilite { color: #e62f1a; position:relative; left:142px;} * html .hilite { left:140px;} .hilite2 { color:#f00; margin:10px 0 20px;} * html .hilite2 { padding-top:10px;} .hilite_big { color: #e62f1a; font-size: 13px; font-weight: bold; } .big { font-size: 13px; font-weight: bold; } .left { float: left; } .left_padded { float: left; margin-right: 45px; } .right { float: right; } .headernote { text-indent: 10px; padding: 3px 0 0 0; } /* ----------------- IMAGES ----------------- */ img { border: none; } .home_ad { margin: 0 -5px 10px 0; } /* ----------------- HEADINGS -----------------*/ h2 { margin: 0; font-family: Arial, sans-serif; font-size: 20px; color: #5a5a5a; } h3 { margin: 0 0 8px 0; font-family: Arial, sans-serif; font-size: 16px; color: #5a5a5a; } /* ----------------- LINKS -----------------*/ a { color: #565656; text-decoration: none; outline: none; } a:hover { text-decoration: underline;} a:visited { color: #565656; } .underlined { text-decoration: underline; } .hilite_underlined, .hilite_underlined:visited { text-decoration: underline; color: #e62f1a; } .nextlink { padding: 0 12px 0 0; font-size: 9px; background: url('/media/images/global/global_bullet_next.gif') right 1px no-repeat; margin-left:0px;} .prevlink { padding: 0 0 0 12px; font-size: 9px; background: url('/media/images/global/global_bullet_prev.gif') left 1px no-repeat;} a.bulletedlink { padding: 0 0 0 7px; font-weight: bold; background: url('/media/images/global/global_bullet.gif') 0 3px no-repeat; } a.bulletedlink2, a.bulletedlink2:visited { padding: 3px 30px 0 0; font-size: 9px; font-family: "Arial Black", Arial, sans-serif; color: #e62f1a; background: url('/media/images/global/product_button.gif') right 0 no-repeat; text-decoration:underline; } a:hover.bulletedlink2 { color:#000;} a.bulletedlink3, a.bulletedlink3:visited { padding: 0 8px 0 0; background: url('/media/images/global/global_bullet.gif') right 3px no-repeat; } .linklist_link { display: block; padding: 7px 15px 3px 0; font-weight: bold; background: url('/media/images/global/product_button.gif') right 4px no-repeat;} .linklist_print { display: block; padding: 7px 10px 7px 0; font-weight: bold; background:url('/media/images/global/print_icon.gif') right 4px no-repeat; } * html .linklist_print { width:145px; width: auto;} .link_print { display: block; padding: 7px 10px 7px 0; font-weight: bold; right 4px no-repeat; } * html .linklist_print { width:145px; width: auto;} .linklist_print span { padding-top:4px; display:block; text-decoration:underline;} * html .linklist_link { height: 13px; } a.linklist_link2 { display: block; padding: 7px 0 3px 0; font-weight: bold; color: #e62f1a !important; background: url('/media/images/global/product_button.gif') right 4px no-repeat; } * html a.linklist_link2 { height: 13px; } #narrow_search p a.viewlink { margin-right:15px; text-decoration:underline;} #narrow_search p { margin-left:15px;} a.view { color: #e62f1a !important; text-decoration:underline !important;} /* ----------------- LISTS ----------------- */ ul { padding: 0 0 0 12px; } * html ul { margin: 10px 0 10px 15px; padding: 0 0 0 1px; voice-family: "\"}\""; voice-family:inherit; margin: 10px 0 10px 15px; padding: 0; } li { margin: 0 0 4px 0; } .linklist { width: 155px; margin: 0 0 10px 0; padding: 0 0 2px 0; list-style-type: none; background: url('/media/images/global/global_underline.gif') bottom repeat-x;} /* IE5 HACKS */ .linklist { width: 170px; margin-left: -15px;/* for ie 5 */ voice-family: "\"}\""; voice-family:inherit; width: 155px; margin: 0 0 10px 0; } html>body .linklist {width: 155px;margin: 0 0 10px 0;} .linklist_item {padding-top: 0px; background: url('/media/images/global/global_underline.gif') top repeat-x; } * html .linklist_item { width:158px; width: auto;} .bulleted_list { margin: 0; padding: 0; list-style-type: none; list-style-position: inside; } .bulleted_list li { margin: 2px 0 2px 0; padding: 0 0 0 10px; background: url('/media/images/global/global_bullet.gif') 0 3px no-repeat; } * html .bulleted_list li { padding: 0; background: url('/media/images/global/global_bullet.gif') 5px 3px no-repeat; } .bulleted_list li.bulletedlist_header { padding: 0; font-weight: bold; background: none; } *html .bulleted_list li.bulletedlist_header { margin: 0 0 0 -10px; } /* ----------------- TABLES ----------------- */ table { border-collapse: collapse; font-size: 10px;l} /* ----------------- FORMS ----------------- */ form { margin: 0; padding: 0; } fieldset { padding: 0; border: none;} .sortbybox { float: left; width: 35%; } select { margin: 3px 0 3px 0; font-size: 10px; color: #565656; } input { color: #565656; font-size: 11px; padding: 2px 0 2px 2px; } textarea { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #565656;} .checkbox {padding: 0; margin: 0 0 0 0;} /* ----------------- MISC ----------------- */ .hide { display: none; } hr { margin: 10px 0 10px 0; background: url('/media/images/global/global_underline.gif') repeat-x; border: none; } .print_link { color:#333; text-transform:uppercase; position:relative;top:-2px; font-weight:bold; text-decoration:underline;} a.print_link:hover { color:#000;} .tabs { clear: both;float: right; margin: 0 15px 5px 0;} .tabsbox { position:relative;top:5px; voice-family: "\"}\""; voice-family:inherit; position:relative;top:10px; } .tabsbox2 { position:relative;top:10px;margin-top: -20px;} * html .tabsbox2 { top:22px; margin: 0; margin-right: 15px; margin-top: -32px;} .tabs_bottom { margin-right:15px;} * html .tabs_bottom { margin-right:30px;} * html .tabs_bottom { margin-right:30px;} .tab_off { float: left; height: 22px; padding: 5px 0 0 0; background: url('/media/images/global/global_tab_off_bg.gif') repeat-x; font-weight: bold; color: #ffffff; } .tab_off_left { float: left; width: 12px; height: 22px; margin: 0 0 0 2px; background: url('/media/images/global/global_tab_off_left.gif') no-repeat; } .tab_off_right { float: left; width: 12px; height: 22px; background: url('/media/images/global/global_tab_off_right.gif') no-repeat; } .tab_on { float: left; height: 22px; padding: 5px 0 0 0; background: url('/media/images/global/global_tab_on_bg.gif') repeat-x; font-weight: bold; color: #ffffff;} .tab_on_left { float: left; width: 12px; height: 22px; margin: 0 0 0 2px; background: url('/media/images/global/global_tab_on_left.gif') no-repeat;} .tab_on_right { float: left; width: 12px; height: 22px; background: url('/media/images/global/global_tab_on_right.gif') no-repeat;} .contentwidth {width:440px}