/* --------------------------------------------- 01. main/default elements --------------------------------------------- */ * { margin:0; padding:0; font-family:arial; } html { overflow-x:hidden; overflow-y:scroll; height:100%; } body { background:#7e7e7e; margin:0; padding:0; height:100%; } a:link,a:visited { color:#fff; text-decoration:none; } a:hover { color:#fff; text-decoration:underline; } p { font-size:12px; color:#858585; } h1 { font-size:21px; color:#E55B2B; } h2 { font-size:17px; color:#E55B2B; } h4 { font-size:12px; color:#000000; } h5 { font-size:12px; color:#000000; } .right { float:right; } /* --------------------------------------------- 02. container and wrapper --------------------------------------------- */ body.cms { background:#980b1c; } #container { width:100%; height:100%; min-height:100%; position:relative;} #container_products { width:100%; float:left; background:#903711; } #container_cms { width:100%; float:left; background:#90061A; } #container_projects { width:100%; float:left; background:#556503; } #wrapper { width:960px; margin:0 auto; height:100%; } #pbox-wrapper { position:fixed; z-index:998; width:960px; left:50%; margin-left:-480px;} /* #pbox-wrapper { position:fixed; bottom:29; width:960px; left:50%; margin-left:-480px; z-index:50; } */ /* --------------------------------------------- 03 header / header-left - logo and links --------------------------------------------- */ #header { width:100%; height:80px; float:left; position:relative; z-index:3; background-color: #ffffff; margin-bottom: 20px;} /* margin-bottom = gap to tabs */ #tvcommon { width:960px; height:45px; z-index:3; margin-left: auto; margin-right: auto;} #tvcommon ul { margin: 0; padding: 0; list-style-type: none; text-align: center; margin-top: 15px; margin-right: 20px; } #tvcommon ul li { display:inline; } #tvcommon ul li a { color:#1d1d1d; font-size:10px; text-decoration: none; } #tvcommon ul li span { color:#1d1d1d; font-size:10px; text-decoration: none; } #tvhdrlogin { width: 100%; height:40px; display: none; float:left; position:relative; background:url(../images/newnav/tnav-greybar-1px.gif) repeat-x;z-index:50;} #tvhdrloginform { width:960px; height:40px; position:relative; margin-left: auto; margin-right: auto; z-index:50;} #tvhdrlogin form { float:right; color:#ededed; font-size:10px; font-weight: bold; margin-right: 15px; margin-top: -4px; } #tvhdrlogin form input { width: 100px; margin-right: 15px; color:#9e0202; font-size: 10px;} #menu #nav_search { float:right; color:#ffffff; font-size: 9px; margin-right: 0px; margin-top: 11px;} /* --------------------------------------------- 03.1 top navigation --------------------------------------------- tnav-redbar-1px */ #navigation { width:100%; float:left; position:relative; background:url(../images/newnav/tnav-redbar-1px.gif) repeat-x; } #menu { width: 960px; position:relative;z-index:50; margin-left: auto; margin-right: auto;} #menu li.toplink { float:left; position:relative; } #menu li.toplink a { height:38px; float:left; color:#FFFFFF; text-decoration:none; } #menu li.toplink ul { margin:38px 0 0; display:none; } #menu li.toplink:hover ul { display:block; } /*#menu li.toplink:hover ul { display: block; }*/ #menu li.toplink ul li a { float:none; height:25px; font-size: 11px;} #menu #nav_cms { width:142px; background:url(../images/bg_nav_cms.png) no-repeat; } #menu #nav_cms:hover { width:142px; background:url(../images/bg_nav_cms_over.png) no-repeat; } #menu #nav_cms a { width:142px; } #menu #nav_projects { width:142px; background:url(../images/bg_nav_projects.png) no-repeat; } #menu #nav_projects:hover { width:142px; background:url(../images/bg_nav_projects_over.png) no-repeat; } #menu #nav_projects a { width:138px; } #menu #nav_products { width:142px; background:url(../images/bg_nav_products.png) no-repeat; } #menu #nav_products:hover { width:142px; background:url(../images/bg_nav_products_over.png) no-repeat; } #menu #nav_products a { width:142px; } #menu #nav_advice { width:142px; background:url(../images/bg_nav_solution.png) no-repeat; } #menu #nav_advice:hover { width:142px; background:url(../images/bg_nav_solution_over.png) no-repeat; } #menu #nav_advice a { width:142px; } #menu #nav_promotions { width:142px; background:url(../images/bg_nav_promotions.png) no-repeat; } #menu #nav_promotions a { width:142px; } #menu #nav_shop { width:142px; background:url(../images/bg_nav_shop.png) no-repeat; } #menu #nav_shop a { width:142px; } #searchfldtitle { width:55px; height: 18px; float: left; background:url(../images/bg_nav_search2.png) no-repeat; left: -70px; margin-top: 1px; margin-right: 0px;} #tvpainthHeader_headerInputSearchButton { top: 2px; left: -3px;} #menu li ul { padding:5px 4px; } #menu li ul li { display:block; width: 142px; font-size:11px; } #menu li ul li a { display:block; font-size:11px; color:#FFFFFF; line-height:2em; border-bottom:1px dashed #FFFFFF; padding-left:4px; padding-top: 6px; } #menu li ul li a:hover { color:#F6F6F6; } #menu li ul li a.last { border:none; } #menu #nav_cms ul { background:url(../images/bg_submenu_cms.png) no-repeat bottom left; position:relative; z-index:5; } #menu #nav_cms ul li a { width:125px; } #menu #nav_projects ul { width:142px; background:url(../images/bg_submenu_projects.png) no-repeat bottom left; position:relative; z-index:5; } #menu #nav_projects ul li a { width:125px; } #menu #nav_products ul { width:142px; background:url(../images/bg_submenu_products.png) no-repeat bottom left; position:relative; z-index:15; } #menu #nav_products ul li a { width:125px; } #menu #nav_advice ul { width:142px; background:url(../images/bg_submenu_advice.png) no-repeat bottom left; position:relative; z-index:5; } #menu #nav_advice ul li a { width:125px; } #menu #nav_storelocator ul { width:142px; height:30px; float:left; background:url(../images/bg_submenu_storelocator.png) no-repeat bottom left; padding-left:11px; padding-bottom:0; margin-top:-10px; position:relative; z-index:5; } #menu #nav_storelocator ul fieldset { float:left; width:140px; padding-top:-5px; padding-left: 4px; } #menu #nav_storelocator ul fieldset .input { width:85px; height:14px; float:left; font-size:11px; color:#868686; border:1px solid #F6F3F7; border-top:1px solid #868686; padding:1px 3px; position:relative; z-index:5; } #menu #nav_storelocator ul fieldset #tvpainthHeader_headerInputZipcodeButton { position:absolute; left:110px; float:right; padding-top: 2px; padding-left: 7px; } /* --------------------------------------------- 04. content --------------------------------------------- */ #content { width:960px; float:left; position:relative; z-index:2; } /* --------------------------------------------- 05. main content area --------------------------------------------- */ #products { width:960px; float:left; margin-top:1px; } #projects { width:960px; float:left; } #projects h1 { color:#8D9857; } #projects h2 { color:#8D9857; } #color_made_simple, #cms { width:960px; float:left; } #color_made_simple h1, #cms h1 { font-weight:bold; color:#E40A2A; } #color_made_simple h2, #cms h2 { color:#E40A2A; } #expert_advice, #advice { width:960px; float:left; } #expert_advice h1, #advice h1 { color:#658fac; } #expert_advice h2, #advice h2 { color:#658fac; } #locator, #future { width:960px; float:left; } #locator h1, #future h1 { color:#7a518f; } #locator h2, , #future h2 { color:#7a518f; } .hilight_red { color:#e51937; } /* --------------------------------------------- 05.1 main content area - buttons --------------------------------------------- */ #products .buttons_right { width:290px; float:right; padding-right:18px; } #products .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_products1.png) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #products .buttons_right .button2 a { width:96px; height:27px; float:left; background:url(../images/bg_button_products2.gif) no-repeat; font-size:10px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:12px; padding-left:8px; } #products .buttons_right .button2 a.active { background:url(../images/bg_button_products2_plus.gif) no-repeat; } #projects .buttons_right { width:290px; float:right; padding-right:18px; } #projects .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_project1.gif) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #projects .buttons_right .button2 a { width:96px; height:27px; float:left; background:url(../images/bg_button_project2.gif) no-repeat; font-size:10px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:12px; padding-left:8px; } #projects .buttons_right .button2 a.active { background:url(../images/bg_button_project2_plus.gif) no-repeat; } #color_made_simple .buttons_right, #cms .buttons_right { width:290px; float:right; padding-right:18px; } #color_made_simple .buttons_right .button1 a, #cms .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_cms1.gif) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #cms .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_cms1.gif) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #color_made_simple .buttons_right .button2 a, #cms .buttons_right .button2 a { width:96px; height:27px; float:left; background:url(../images/bg_button_cms2.gif) no-repeat; font-size:10px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:12px; padding-left:8px; } #color_made_simple .buttons_right .button2 a.active, #cms .buttons_right .button2 a.active { background:url(../images/bg_button_cms2_plus.gif) no-repeat; } #expert_advice .buttons_right, #advice .buttons_right { width:290px; float:right; padding-right:18px; } #expert_advice .buttons_right .button1 a, #advice .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_advice1.gif) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #expert_advice .buttons_right .button2 a, #advice .buttons_right .button2 a { width:96px; height:27px; float:left; background:url(../images/bg_button_advice2.gif) no-repeat; font-size:10px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:12px; padding-left:8px; } #expert_advice .buttons_right .button2 a.active, #advice .buttons_right .button2 a.active { background:url(../images/bg_button_advice2_plus.gif) no-repeat; } #locator .buttons_right, #future .buttons_right { width:290px; float:right; padding-right:18px; } #locator .buttons_right .button1 a, #future .buttons_right .button1 a { width:175px; height:30px; float:left; background:url(../images/bg_button_locator1.gif) no-repeat; text-align:center; font-size:13px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:8px; } #locator .buttons_right .button2 a, #future .buttons_right .button2 a { width:96px; height:27px; float:left; background:url(../images/bg_button_locator2.gif) no-repeat; font-size:10px; line-height:2em; color:#FFFFFF; text-decoration:none; padding-top:12px; padding-left:8px; } #locator .buttons_right .button2 a.active, #future .buttons_right .button2 a.active { background:url(../images/bg_button_locator2_plus.gif) no-repeat; } .buttons_right #whiteline { width:945px; height:1px; float:right; margin-right:-10px; background:url(../images/bg_whiteline.gif) repeat-x bottom right; } .buttons_right { font-weight:bold; z-index: 99999; position:relative;} #future p { font-size: 14px; padding: 10px 0px 20px 0px; } #future p a { color: #CC0000; } #future .store_locator p { padding: 0px 0px 0px 0px !important; } /* --------------------------------------------- 06. content box small - borders --------------------------------------------- */ #content #contentbox-small { width:450px; margin-left: 255px; padding-bottom:18px; } #content #contentbox-small .coupon { left:50%; margin-left:-71px; position:absolute; text-align:center; top:390px; } /* --------------------------------------------- 06. content box - borders --------------------------------------------- */ #content #contentbox { width:960px; float:left; padding-bottom:18px; } #content .contentbox_bordertop { width:960px; height:10px; float:left; background:url(../images/bg_contentbox_bordertop.png) no-repeat; overflow:hidden; margin-top:-1px; } #content .contentbox_bordermiddle { width:955px; float:left; background:url(../images/bg_contentbox_bordermiddle.png) repeat-y; padding-left:3px; padding-right:2px; } #content .contentbox_borderbottom { width:960px; height:10px; float:left; background:url(../images/bg_contentbox_borderbottom.png) no-repeat; overflow:hidden; } /* --------------------------------------------- 06.1 content box - subnav --------------------------------------------- */ #content .breadcrumbs { float:left; padding-left:15px; padding-bottom:12px; } /* new breadcrumbs #content .breadcrumbs ul li { float:left; background:url(../images/arrow_subnav2.gif) no-repeat right center; font-size:9px; color:#808285; padding-left:3px; padding-right:11px; } */ #content .breadcrumbs ul li { float:left; font-size:9px; color:#808285; padding-left:3px; padding-right:2px; } #content .breadcrumbs ul li span { font-size:9px; color:#808285; padding-left:3px; padding-right:2px; } #content .breadcrumbs ul li a { color:#808285; text-decoration:none; } #content .breadcrumbs ul li a:hover { color:#030303; text-decoration:none; } #content .breadcrumbs ul li.selected { background:none; } #content .breadcrumbs ul li.selected { color:#030303; text-decoration:none; } /* --------------------------------------------- 06.1 content box - subnav --------------------------------------------- */ #content .subnav { float:left; padding-left:15px; padding-bottom:12px; } /* old btn breadcrumb look #content .subnav ul li { float:left; background:url(../images/arrow_subnav2.gif) no-repeat right center; font-size:14px; color:#808285; padding-left:10px; padding-right:20px; } */ #content .subnav ul li { float:left; font-size:14px; color:#808285; padding-left:2px; padding-right:3px; } #content .subnav ul li span { color:#808285; padding-left:8px; padding-right:5px; } #content .subnav ul li a { color:#808285; text-decoration:none; } #content .subnav ul li a:hover { color:#030303; text-decoration:none; } #content .subnav ul li.selected { background:none; } #content .subnav ul li.selected a { color:#030303; text-decoration:none; } /* --------------------------------------------- 06.2 content box - greybox --------------------------------------------- */ #content .greybox { width:955px; float:left; background:#F3F4F4 url(../images/bg_greybox_bordertop.gif) repeat-x top left; margin-bottom:15px; } #content .greybox h1 { width:930px; float:left; padding:8px 0 8px 16px; font-weight:bold; } #content .greybox p { width:930px; float:left; padding-bottom:16px; padding-left:16px; } #content .greybox ul { float:left; padding:2px 8px 0 16px; font-size:12px; margin-bottom:8px; } #content .greybox ul li { padding:2px 0 0; color:#858585; font-size:12px; } #content .greybox .greybox_borderbottom { width:955px; height:3px; float:left; background:url(../images/bg_greybox_borderbottom.gif) repeat-x; } /* --------------------------------------------- 06.3 content box - product list --------------------------------------------- */ #productslist { width:935px; float:left; background:url(../images/bg_productslist_5col.gif) repeat-y; padding-left:20px; } #productslist h1 { padding-bottom:7px; } #productslist h2 { padding-bottom:7px; font-weight:bold; } #productslist img { padding-bottom:11px; } #productslist .button { float:left; font-size:12px; color:#636466; } #productslist .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; padding:5px 21px 0 10px; } #productslist .product1 { width:160px; float:left; text-align:center; } #productslist .product1 .button { padding-left:20px; } #productslist .product2 { width:220px; float:left; text-align:center; } #productslist .product2 .button { padding-left:50px; } #productslist .product3 { width:190px; float:left; text-align:center; } #productslist .product3 .button { padding-left: 36px; } #productslist .product4 { width:180px; float:left; text-align:center; } #productslist .product4 .button { padding-left:35px; } #productslist .product5 { width:180px; float:left; text-align:center; } #productslist .product5 .button { padding-left:35px; } /* --------------------------------------------- 06.4 content box - modules box --------------------------------------------- */ #modules { width:875px; float:left; padding-left:80px; padding-top:10px} #modules .set { width:220px; height:186px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 31px 0 16px} #modules .set h2 { background:url(../images/bg_dottedborder.gif) repeat-x bottom left; font-weight:bold; padding-bottom:12px; margin-bottom:10px} #modules .set h2.quicktip { background: none; font-weight:bold; padding-bottom:1px; margin-bottom:2px} #modules .set h3 { font-size:12px; font-weight:bold; color: #858585; padding-top:5px; padding-bottom:5px; } #modules .set p { height:80px; font-size:11px} #modules .button { float:left; font-size:12px; color:#636466; padding-left:52px} #modules .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px} #modules .set_quicktips { width:220px; float:left} #modules .set_modules1 { width:220px; float:left} #modules .set_modules1 .button1 { float:left; font-size:12px; color:#636466; margin-left:-10px; position:relative} #modules .set_modules1 .button1 a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px} #modules .set_modules1 .button2 { float:left; font-size:12px; color:#636466; margin-right:-10px; position:relative} #modules .set_modules1 .button2 a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px} #modules .signup .button a { background:url(../images/bg_button_signup.gif) no-repeat top left; color:#FFFFFF} #modules a.red { color: #E40A2A; } /* --------------------------------------------- 07.0 footer --------------------------------------------- */ #staydown { position:fixed; bottom:0; width:960px; left:50%; margin-left:-480px; z-index:50; } #footer { width:960px; height:21px; margin-left:auto; margin-right:auto; background:url(../images/bg_footer.png) no-repeat top left; padding-top:10px; z-index:50; } #footer ul li { height:18px; float:left; background:url(../images/bg_dottedline.gif) repeat-y top right; font-size:11px; color:#858585; text-align:center; padding-top:2px; } #footer ul li a { color:#858585; text-decoration:none; } #footer ul li a:hover { color:#858585; text-decoration:underline; } #footer ul li.company { width:138px; } #footer ul li.company_here { width:178px; } #footer ul li.privacy { width:210px; } #footer ul li.copyright { width:198px; } #footer ul li.sitemap { width:110px; } #footer ul li.contactus { width:125px; background:none; } /* --------------------------------------------- 08.0 products interior page - left panel --------------------------------------------- */ #leftpanel { width:695px; height:567px; float:left; overflow-y:auto; } #content #leftpanel .greybox { width:678px; float:left; background:#F3F4F4 url(../images/bg_greybox_bordertop.gif) repeat-x top left; margin-bottom:15px; } #content #leftpanel .greybox h1 { width:650px; float:left; font-weight:bold; padding:8px 0 12px 16px; } #content #leftpanel .greybox p { width:650px; float:left; padding-bottom:16px; padding-left:16px; } #content #leftpanel .greybox .greybox_borderbottom { width:680px; height:3px; float:left; background:url(../images/bg_greybox_borderbottom.gif) repeat-x; } #leftpanel .setlist { width:650px; float:left; padding-left:22px; } #leftpanel .setlist h3 { font-weight:bold; font-size:14px; margin-top:8px; } #leftpanel .set { width:650px; float:left; background:url(../images/bg_dottedborder.gif) repeat-x bottom left; padding:15px 0 5px; } #leftpanel .set .photo { width:150px; float:left; text-align:center; background:url(../images/bg_dottedline.gif) repeat-y top right; } #leftpanel .set .rightcontent { width:480px; float:left; padding-left:10px; } #leftpanel .set .rightcontent p { font-size:11px; line-height:1.5em; padding-bottom:5px; } #leftpanel .set .rightcontent ul { width:480px; float:left; padding-bottom:15px; } #leftpanel .set .rightcontent ul li { width:470px; float:left; background:url(../images/li_bullet.gif) no-repeat 0 5px; font-size:11px; color:#858585; padding-bottom:3px; padding-left:8px; } #leftpanel .set .rightcontent ul li a { color:#808285; text-decoration:none; } #leftpanel .set .rightcontent ul li a:hover { color:#030303; text-decoration:none; } #leftpanel .set a { color:#808285; text-decoration:none; font-size:11px; color:#858585; } #leftpanel .set a:hover { color:#030303; text-decoration:none; } /* --------------------------------------------- 08.1 products interior - right panel --------------------------------------------- */ #rightpanel { width:252px; float:left; padding-left:4px; } #rightpanel h2 { color:#666666; font-weight:bold; background:url(../images/bg_dottedborder.gif) repeat-x bottom left; padding-bottom:12px; margin-bottom:15px; } #rightpanel p { height:70px; font-size:11px; } #rightpanel .signup { width:220px; height:171px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 16px 0; } #rightpanel .signup .button { float:left; font-size:12px; color:#FFFFFF; padding-left:52px; } #rightpanel .signup .button a { width:88px; height:21px; float:left; background:url(../images/bg_button_signup.gif) no-repeat top left; color:#FFFFFF; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #rightpanel .products { width:220px; height:171px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 16px 0; } #rightpanel .products .button { float:left; font-size:12px; color:#636466; padding-left:52px; } #rightpanel .products .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #rightpanel .lowvoc { width:220px; height:171px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 16px 0; } #rightpanel .lowvoc .button { float:left; font-size:12px; color:#636466; padding-left:52px; } #rightpanel .lowvoc .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #rightpanel .colorselection { width:220px; height:171px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 16px 0; } #rightpanel .photo { float:left; margin-top:-36px; } #rightpanel .colorselection .button { float:right; margin-top:-56px; font-size:12px; color:#636466; padding-left:72px; } #rightpanel .colorselection .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #rightpanel .store_locator { width:220px; height:171px; float:left; background:url(../images/bg_shadowbox.gif) no-repeat; padding:18px 16px 0; } #rightpanel .store_locator fieldset { width:220px; float:left; } #rightpanel .store_locator fieldset .input { width:122px; height:16px; float:left; border:1px solid #E8E7E7; font-size:11px; color:#858585; padding:2px 4px; } #rightpanel .store_locator fieldset .button { float:left; font-size:11px; color:#FFFFFF; padding-left:7px; } #rightpanel .store_locator fieldset .button a { width:49px; height:17px; float:left; background:url(../images/bg_button_go.gif) no-repeat top left; color:#FFFFFF; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } /* --------------------------------------------- 09.0 project page style --------------------------------------------- */ #projectslist { width:925px; float:left; padding-left:30px; padding-bottom:15px; } #projectslist .setbox { width:262px; float:left; padding-right:46px; } #projectslist .setbox .heading { width:262px; float:left; background:url(../images/bg_dottedborder.gif) repeat-x bottom left; padding-bottom:7px; } #projectslist .setbox h2 { float:left; line-height:1.4em; font-weight:bold; } #projectslist .setbox .button { float:right; font-size:12px; color:#636466; } #projectslist .setbox .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #projectslist .setbox .set { width:252px; float:left; background:url(../images/bg_dottedborder.gif) repeat-x bottom left; padding:8px 5px; } #projectslist .setbox .set .photo { float:left; padding-right:12px; } #projectslist .setbox .set .rightcontent { width:180px; float:left; } #projectslist .setbox .set p { font-size:11px; } #projects #modules .quicktips { width:220px; float:left; } #projects #modules .quicktips h2 { background:url(../images/bg_heading_quicktips.gif) no-repeat bottom left; padding-bottom:16px; } /* --------------------------------------------- 10. color made simple page --------------------------------------------- */ #cmslist { width:955px; float:left; background:url(../images/bg_cmslist.gif) repeat-y; padding-bottom:15px; } #cmslist h1 { padding-bottom:5px; font-weight:bold; font-size:17px; } #cmslist p { height: 60px; font-size:11px; } #cmslist .photo { text-align: center; height: 100px; } #cmslist .set { width:198px; float:left; padding:0 20px; } #cmslist .button { margin-left: 35px; font-size:12px; color:#636466; padding-top:0px; } #cmslist .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } .trend { float:left; margin-left:40px; margin-bottom:30px; text-align:center; } #trendlist .trend h2 { font-size:16px; color:#858585; font-weight:bold; } #trendlist .trend h3 { font-size:13px; color:#858585; font-weight:100; } #trendlist .trendswatch { margin:2px auto; color:#fff; width:250px; height:133px; padding:5px; text-align:left; margin-left:auto; margin-right:auto; } #trendlist .peelnplaceblack { width:60px; height:155px; margin-top:2px; padding-top:5px; padding-left:3px; color:#fff; text-align:left; font-size:11px; display:block; float:left; border-right:1px solid #111111; z-index:5; } #trendlist .peelnplacewhite { width:60px; height:155px; margin-top:2px; padding-top:5px; padding-left:3px; color:#fff; text-align:left; font-size:11px; display:block; float:left; border-right:1px solid #FFFFFF; z-index:5; } #trendlist .productnum { width:20px; height:10px; margin-top:145px; padding-top:5px; margin-left:-40px; color:#fff; text-align:left; font-size:11px; display:block; float:left; color:#858585; z-index:5; } .article_right { float: right; display: block; width: 394px; margin: 0px 0px 0px 28px; background-color: #FFF; } .image_left { float: left; width: 228px; } /* --------------------------------------------- 10. expert advice page --------------------------------------------- */ #advicelist { width:955px; float:left; background:url(../images/bg_advicelist.gif) repeat-y; padding-bottom:5px; display:block; position:relative; } #advicelist h1 { padding-top:25px; padding-bottom:5px; font-size:18px; font-weight:bold; } #advicelist p { font-size:11px; padding-bottom:5px; } #advicelist .photo { padding-top:5px; float:left; padding-right:10px; margin-left:-7px; } #advicelist .photo-center img { padding-top:25px; display:block; margin-left:auto; margin-right:auto; } #advicelist .set { width:275px; float:left; padding:0 20px; height:175px; } #advicelist .bottom-button-holder {bottom:5px; margin-left:auto; margin-right:auto; } /* #advicelist .bottom-button-holder { position:absolute; bottom:5px; margin-left:auto; margin-right:auto; } */ #advicelist .button { padding-left:77px; font-size:12px; color:#636466; } #advicelist .button-ask { padding-left:120px; font-size:12px; color:#636466; } #advicelist .button a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #advicelist .button-ask a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; text-align:center; padding:5px 21px 0 10px; } #leftpanel { width:695px; height:567px; float:left; overflow-y:auto; } #expert_advice #leftpanel .greybox h1, #advice #leftpanel .greybox h1 { width:650px; color: #658fac; float:left; font-weight:bold; padding:8px 0 12px 16px; } /* --------------------------------------------- 11. overlays and background images --------------------------------------------- */ div.colorOverlay { display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.cmsOverlay { background-color:#90061A; opacity:0.62; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=62); filter:alpha(opacity=62); -moz-opacity:0.62; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.projectsOverlay { background-color:#556503; opacity:0.57; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=57); filter:alpha(opacity=57); -moz-opacity:0.57; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.productsOverlay { background-color:#e75a28; opacity:0.40; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=40); filter:alpha(opacity=40); -moz-opacity:0.40; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.adviceOverlay { background-color:#1b5d8d; opacity:0.62; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=62); filter:alpha(opacity=62); -moz-opacity:0.62; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.locatorOverlay { background-color:#50345e; opacity:0.62; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=62); filter:alpha(opacity=62); -moz-opacity:0.62; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } div.futureOverlay { background-color:#50345e; opacity:0.62; -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=62); filter:alpha(opacity=62); -moz-opacity:0.62; z-index:-1; display:block; position:fixed; top:0; left:0; width:100%; height:100%; z-index:-1; } img.bgimage { top:0; left:0; position:absolute; z-index:-10; } /* --------------------------------------------- 12. hotspots --------------------------------------------- */ ul#hotspots { list-style:none; margin:0; padding:0; } #hotspots li { position:absolute; display:block; text-indent:-9000px; background:url(../images/pbox-swatch-mag-glass.png) no-repeat; width:21px; height:21px; z-index:-2; } #hotspots li.active { background:url(../images/pbox-swatch-mag-glass.png) no-repeat; width:21px; height:21px; } #hotspot-show { display:block; position:absolute; top:26%; left:76%; z-index:-3; } div.pnlswatch { display:block; border-color:#555; height:80px; width:90px; -webkit-transition:border-color 400ms; } /*paint swatch popup*/ div#pswatch { position:relative; height:40px; width:288px; } div#pswatch div#swatchcolor { position:absolute; display:block; background-color:#e5a73e; width:30px; height:30px; left:4px; top:4px; } div#pswatch div#swatch { position:absolute; display:block; float:left; width:38px; } div#pswatch div#mag { position:absolute; display:block; float:left; width:27px; top:3px; left:3px; } div#pswatch div#description { left:35px; position:absolute; display:block; width:138px; background:url(../images/pbox-swatch-desc-gradient.png) repeat-x; height:38px; z-index:-1; } div#pswatch div#description h2 { font-family:Arial; font-size:13px; padding-left:10px; color:#e5a73e; margin-top:-1px; line-height:10px; padding-top:9px; font-weight:bold; } div#pswatch div#description h3 { font-family:Arial; font-size:10px; padding-left:10px; color:#000000; line-height:10px; } div#pswatch div#tab { display:block; float:right; width:115px; } /* --------------------------------------------- 13. misc --------------------------------------------- */ #bottom-content { width:960px; height:200px; position:fixed; bottom:0; display:block; } /* MRR Added for chevron search / sign up */ #search-dropdown-container { position:absolute; top:+94px; left:+4px; z-index:3; height:43px;} #sign-up-dropdown-container { position:absolute; top:+70px; left:4px; z-index:3; height:190px;} #searchbtn { position:absolute; z-index:20; margin-top:+60px;} #signupbtn { position:absolute; z-index:20; margin-left:+72px; margin-top:+60px;} #register-buttons { position:relative; z-index:20;} .a .flag-dropdown-search { width:165px; top:0; height:43px; background:#f9f9f7; padding:25px 0 0 10px; position: relative; z-index: 3; } .a .flag-dropdown-sign { width:165px; height:190px; background:#f9f9f7; padding:25px 0 0 10px; position: relative; z-index: 3;} .a .flag-dropdown,logingrouping { display:block; position: relative; z-index: 3;} .a .flag-dropdown-bottom { width:175px; height:17px; top:-15px; background:url(../images/search-bg.png); position: relative; z-index: 3;} .a .flag-dropdown { width: 162px; height: 190px; background: #f9f9f7; padding: 45px 0 0 10px;position: relative;z-index: 3;} .flag-dropdown-search { width:165px; height:50px; top: -30px; background:#f9f9f7; padding:39px 0 0 10px; position: relative; z-index: 3;} .flag-dropdown-sign { width:165px; height:190px; top: 3px; background:#f9f9f7; padding:25px 0 0 10px; position: relative; z-index: 3;} .flag-dropdown,logingrouping { display:block; position: relative; z-index: 7;} .flag-dropdown-bottom { width:175px; height:15px; top:-30px; background:url(../images/search-bg.png); position: relative; z-index: 3;} .flag-dropdown-bottom2 { width:175px; height:15px; top:+3px; background:url(../images/search-bg.png); position: relative; z-index: 3;} .flag-dropdown { width: 162px; height: 190px; background: #f9f9f7; padding: 45px 0 0 10px;position: relative;} /* #ad-wrapper { bottom:65px; position:absolute; z-index:40; } */ #ad-wrapper { bottom:65px; position:fixed; z-index:40; width:960px; left:50%; margin-left:-480px; } a.red { color: #E40A2A; } #homeads {width:960px; height:156px; position: relative; float:left; background:url(../images/home-banner/home-banner-bg.png) no-repeat;} /*.home-bucket { width: 319px; height: 156px; float: left;} .home-bucket h2 { height: 40px; color: #666; font-size: 18px; text-align: center; padding-top: 10px;} .home-bucket h2 .red { color: #cf1629; font-weight:bold } .home-bucket .instant_savings_img { float:left; margin: 0px 0px 0px 20px; width: 149px; height: 98px; } .home-bucket .instant_savings_txt { width:130px; float:left; margin: 0px 0px 0px 0px; text-align: center !important; } .home-bucket .instant_savings_txt p { font-size:11px; text-align: center !important; } .home-bucket .instant_savings_txt .disclaimer_link{ font-size:9px; margin: 5px 0px 5px 0px; text-align: center !important; display: block; } .home-bucket .instant_savings_txt .disclaimer_link a { color: #666; text-decoration:underline; text-align: center; }*/ .home-bucket h2.bogo_red { color: #c71429; font-weight: bold; } #disclaimer p { font-size: 11px; margin: 0px 50px 30px 50px; } #disclaimer h2 { height: 40px; color: #666; font-size: 18px; text-align: center; padding-top: 10px;} #disclaimer h2 .red { color: #cf1629; font-weight:bold } /*#homeads .photo {float: left; margin-left: 25px; margin-top: 5px;} .bottom-photo {float: left; margin-left: 40px; margin-top: -5px;} .bucket-copy {text-align: center; } .bucket-copy p { color: #666; font-size: 11px; font-weight: 100; width: 280px; } .bucket-left{ float: left; text-align: center; width: 105px; padding-top: 10px;} .bucket-center{ float: left; text-align: center; width: 85px; padding-top: 10px;} .bucket-right{ float: left; text-align: center; width: 125px; padding-top: 10px;} .bucket-left h5, .bucket-center h5, .bucket-right h5 {color: #666; font-size: 10px; font-weight: 100; } #homeads .new-button, .contentButton { float:left; font-size:12px; color:#636466; } #homeads .new-button { margin-top: 10px; margin-left: 11px; width: 170px; text-align: center;}*/ #homeads .button a, .contentButton a, .contentButtonRed a { width:88px; height:21px; float:left; background:url(../images/bg_button.png) no-repeat top left; color:#636466; text-decoration:none; padding:5px 21px 0 10px} .contentButtonRed a { background:url("../images/bg_button_signup.gif") no-repeat top left; color: #fff !important; padding-top: 6px;} .contentButton a:hover {color: #636466 !important;} /*#bucket1, #bucket2 { border-right: 1px solid #111111; } #bucket1 .bucket-copy h4 {padding-left: 5px; margin-top: 15px;} #bucket1 .bucket-copy .button {margin-left: 25px; margin-top: 15px;} #bucket3 .bucket-copy h4 { margin-top: 5px; margin-left:138px; width: 140px;} #bucket3 .bucket-copy .button {margin-left: 31px; margin-top: 10px;}*/ .lastTrend { background-image: none !important; } #content .setlist ul li { float:left; background:url(../images/arrow_subnav2.gif) no-repeat right center; font-size:14px; color:#808285; padding-left:10px; padding-right:20px; } #content .setlist ul#toc li { background-image: none; float: none; } #content #paint101 .setlist ul li { font-size:14px; color:#808285; padding-left:10px; padding-right:20px; } #content .setlist ul li { background-image: none; float: none; } /* Haniff Murray 7/7/2010: WIP - Changes to jump list consistency .pp-jump-links { border-bottom:2px dotted #B1B2B0; margin-bottom:15px; padding-bottom:15px; } #ContentBlockSubnav .pp-jump-links h2 { color:#658FAC; } .pp-jump-links #toc { font-size:14px; list-style-type:none; } .subnav #ContentBlockSubnav .pp-jump-links li { color:#858585; font-size:14px; background:inherit; float:inherit; padding-left:inherit; padding-right:inherit; } #ContentBlockSubnav .pp-jump-links a:link { color:#658FAC; font-size:14px; text-decoration:underline; } */ a.contestButtonSmall { color: #fff; font-weight: bold; font-size: 10px; float: left; display: block; height: 33px; padding-right: 11px; margin-right: 5px; background: url(../images/button_right_small.png) no-repeat right top; padding-bottom: 3px; text-align: center; } a.contestButtonSmall:hover { text-decoration: none; } a.contestButtonSmall span { text-align: center; padding: 10px 8px 10px 20px; height: 21px; display:block; } a.contestButtonSmall span { background: url(../images/button_left_small.png) no-repeat; } #tvpainthHeader_headerInputSearchButton { margin-top: 2px; float: left; margin-left:3px;} #tvpainthHeader_headerInputSearch { margin-top: 5px; float: left;} input.gsc-search-button {color: #000;} /* new buttons */ #productlist .new-button { width:160px; float:left; text-align: center; } #modules .new-button { width:220px; float:left; text-align: center;} .set .new-button { width:275px; float:left; text-align: center; } #photoleftbtn {margin-left: 40px; margin-top: -70px;} #cmslist .new-button { width:198px; float:left; text-align: center; } #projectslist .heading .new-button { width:100px; float:right; text-align: right; } #rightpanel .signup .new-button { width:220px; float:left; text-align: center; margin-top: -20px; } #rightpanel .new-button { width:220px; float:left; text-align: center; } #rightpanel #rightphotobtn { width:120px; float:left; text-align: center; margin-top: -20px; } #rightpanel fieldset .new-button { width:60px; float:left; text-align: center; } #content .breadcrumbs { float:left; padding-left:15px; padding-bottom:12px; display: inline; font-family: Arial, Helvetica, sans-serif; font-size: 11px;} /* new breadcrumbs #content .breadcrumbs ul li { float:left; background:url(../images/arrow_subnav2.gif) no-repeat right center; font-size:9px; color:#808285; padding-left:3px; padding-right:11px; } */ #content .breadcrumbs ul li {font-family: Arial, Helvetica, sans-serif; font-size: 11px; float:left; padding-left:0px; padding-right:0px; color: #598330;} #content .breadcrumbs ul li span { font-family: Arial, Helvetica, sans-serif; font-size: 11px; padding-left:0px; padding-right:3px; color: #4E4D4D;} #content .breadcrumbs ul li a { color:#598330; text-decoration:none; } #content .breadcrumbs ul li a:hover { color:#030303; text-decoration:none; } #content .breadcrumbs ul li.selected { background:none; } #content .breadcrumbs ul li.selected a { color:#030303; text-decoration:none; } /*#bucket1 .new-button { margin-left: 0px;} #bucket3 .bucket-btn { margin-top: 6px; }*/ .bottomright {margin-left: 300px;} .cms_bucket { width:198px; text-align: center !important; } .cms_bucket a, .cms_bucket div { text-align: center !important; }