/* --------------------- CSS for BusinessCardPrintingDirect.com 01. General 02. Header 03. Main content 04. Main content - Left 05. Main content - Right 06. Footer */ /*---------------------------------------------------------- 01. GENERAL ---------------------------------------------------------- */ @import url("reset.css"); body { background-color: #0166ca; font: 100 12px Arial, Helvetica, sans-serif; } h2 { background: url(/assets/images/background_h2.png) 0px 0px repeat-x; height: 46px; line-height: 51px; font: 800 16px Arial, Helvetica, sans-serif; width:100%; color: #fff; padding: 5px 0 0 10px; margin: 0 0 0 0;} #content { width: 782px; margin: 0 auto; } /*---------------------------------------------------------- 02. HEADER ---------------------------------------------------------- */ #header { background: url(/assets/images/background_header.png) 0% 0% no-repeat; height: 109px; text-align: right; padding-top: 30px; margin: 0;} #headerlogo {float:left; width:width=181px; height: 184px; position:absolute;} #header #headerlogo p { display: none; } #header #loginlink { color: #fef687; font: 800 14px Arial, Helvetica, sans-serif; margin: 0 25px 0 0; position: relative; top: -190px; } #header h1, #header h2 {display: none; } #topnav { background: #000; height: 31px; width: 780px; } #topnav ul {margin: 0 20px 0 0; display:inline; float:right; position: relative; } #topnav ul li { display:inline; float:left; position: relative; margin: 0 0 0 40px; padding: 0; list-style: none; } #topnav ul li a{ color: #fff; text-decoration: none; font: 800 14px Arial, Helvetica, sans-serif; line-height:30px } #topnav2 { background: #fff; height: 20px; width: 780px; } #topnav2 ul {margin: 0 20px 0 0; display:inline; float:right; position: relative; } #topnav2 ul li { display:inline; float:left; position: relative; margin: 0 0 0 20px; padding: 0; list-style: none; } #topnav2 ul li a{ color: #888989; text-decoration: none; font: 100 12px Arial, Helvetica, sans-serif; line-height:20px } #topnav2 ul li a:hover{ text-decoration:underline; } /*---------------------------------------------------------- 03. MAIN CONTENT ---------------------------------------------------------- */ #mainbanner { overflow: hidden; width: 780px; } #mainbanner img { } #maincontent { clear: both; margin: 0 0 20px 0; padding: 0; background: url(/assets/images/main_content_bk.gif) center repeat-y;} .price_button { background: url(/assets/images/checkmark.png) 0% 0% no-repeat; padding-left:10px;} .subnav2 ol{padding:0px; margin:0px;} .subnav2 ol li{padding:0 0 0 25px; width:175px;} /*---------------------------------------------------------- 04. MAIN CONTENT - LEFT ---------------------------------------------------------- */ #mc_left { float: left; width: 220px; margin: 0 0px 0 0; background-color: #0166ca;} #mc_left .ibutton{ height: 50px; margin: 10px 0 10px 0; position: relative; left: -8px;} #mc_left .ibutton p{ display: none; } #mc_left #ordernow { background: url(/assets/images/mc_left_ordernow.png) 0px 0px no-repeat; } #mc_left #getestimate { background: url(/assets/images/mc_left_getestimate.png) 0px 0px no-repeat; } #mc_left_sky { overflow: hidden; width: 210px; background-color: #fff; } #mc_left_sky ul { margin: -15px 0 0 0; padding: 0; border: solid 0px #f00; } #mc_left_sky ul li{ padding: 0 0 0 20px; background: #fff url(/assets/images/background_mc_left_li.png) 0% 100% no-repeat; line-height: 15px; padding-bottom:10px; padding-top:10px; } #mc_left_sky ul li a{ text-decoration: none; color: #000; padding: 0 0 0 0; font: 800 12px Arial, Helvetica, sans-serif; } #mc_left_sky h3 { font: 800 13px Arial, Helvetica, sans-serif; color: #00349b; margin: 0 0 20px 0; padding: 0 0 0 10px; } #mc_left_sky ul#alsoprint { } #mc_left_sky ul#alsoprint li { background-image:none; margin: 5px 0 5px 0; padding: 0 0 0 15px; font: 800 12px Arial, Helvetica, sans-serif;} #mc_left_sky h4 { font: 800 13px Arial, Helvetica, sans-serif; color: #0163c7; margin: 0 0 15px 0; padding: 0 0 0 5px; } #mc_left_sky p { padding: 0 0 11px 5px; } #mc_left_sky p a { text-decoration: none; color: #0163c7; font-weight:bold;} /*---------------------------------------------------------- 05. MAIN CONTENT - RIGHT ---------------------------------------------------------- */ #mc_right { float: left; width: 560px; border: solid 0px #f00; background-color: #0166ca;} #mc_right .halfbox { width: 275px; float: left; background-color: #fff; margin: 10px 10px 10px 0; padding: 0 0 0 0; border: solid 0px #f00; overflow: hidden; } #mc_right #specials { margin: 10px 0 10px 0; } #mc_right .halfbox h2{ height: 25px;} #mc_right #everydaydeals .dealsline1, #mc_right #everydaydeals .dealsline2 { margin:0;padding:10px 0 10px 16px; } #mc_right #everydaydeals .dl_1 { font-size: 15px; font-weight:bold; } #mc_right #everydaydeals .dl_2 { font-size: 12px; } #mc_right #everydaydeals .dl_3 { font-size: 14px; color: #003296; font-weight:bold;} #mc_right #everydaydeals .vertsep { border-left: solid 1px #b2b3b3; margin: 0 0 0 10px;} #mc_right #everydaydeals .dealsline1 { background-color: #e6f0fa; } #mc_right #everydaydeals .dealsline2 { background-color: #cce0f4; } #mc_right #everydaydeals .dealsline1 input{ background-color: #e6f0fa; } #mc_right #everydaydeals .dealsline2 input{ background-color: #cce0f4; } #mc_right #specials { background: #fff url(/assets/images/background_specials.jpg) 100% 100% no-repeat; height:240px;} #mc_right #specials h2 { margin-bottom: 10px; } #mc_right #specials a { display: block; color: #00349b; font-size: 22px; font-weight: bold; margin: 0 0 0 0; padding: 0 0 10px 12px;} #mc_right #specials p { margin: 0 0 12px 0; padding: 0 0 0 12px; width: 145px; } #mc_right #specials strong { font-size: 13px; } #mc_right #specials #specials_price { padding: 0 0 0 12px; font-size: 18px; font-weight: bold;} #mc_right #specials #specials_price strong { font-size: 36px; color:#e70488; display: block;} #mc_right .fullbox2 { clear: both; background-color: #fff; overflow:hidden;} #mc_right .fullbox2 h2 { margin: 0px 0px 0px 0px; height:25px; } #mc_right .fullbox2 h3 { font-weight:bold; font-size: 14px; color: #000; margin: 0 0 10px 0; padding: 0 0 0 10px; } #mc_right .fullbox2 p { margin: 0 0 10px 0; padding: 0 10px 0 10px; } #mc_right .fullbox2 ul { padding: 0 0 10px 10px; margin: 0; list-style: none; } #mc_right .fullbox2 ul li{ margin: 0 0 5px 0.5em; background-image: url(/assets/images/bullet_small_blue.gif); background-position: 0 5px; background-repeat: no-repeat; padding: 0 0 0 1.0em; color: #00349b; font-weight: bold; font-size: 14px; } #mc_right .fullbox2 h4{ font-size: 18px; font-weight: bold; margin: 0 0 10px 0; padding: 0 0 0 10px; } #mc_right .fullbox2 ol{ display:inline; float:left; position: relative; margin-bottom: 10px; } #mc_right .fullbox2 ol li { height: 53px; width: 173px; display:inline; float:left; position: relative; margin: 0 0 0 10px; padding: 0; list-style: none;} #mc_right .fullbox2 ol li p { display: none; } #mc_right .fullbox2 ol li#step1 { background: #fff url(/assets/images/li_orderstep_1.jpg) 0% 0% no-repeat; } #mc_right .fullbox2 ol li#step2 { background: #fff url(/assets/images/li_orderstep_2.jpg) 0% 0% no-repeat; } #mc_right .fullbox2 ol li#step3 { background: #fff url(/assets/images/li_orderstep_3.jpg) 0% 0% no-repeat; } h5{ font-weight:bold; font-size: 14px; color: #003296; margin: 0 0 0px 0; padding: 0 0 0 0px; } #mc_right .fullbox { clear: both; background-color: #fff; overflow:hidden; } #mc_right .fullbox h2 { background-image: none; color: #0166ca; font-weight: bold; font-size: 24px; margin:0 0 5px 0; height: 25px; } #mc_right .fullbox h3 { font-weight:bold; font-size: 14px; color: #000; margin: 0 0 10px 0; padding: 0 0 0 10px; } #mc_right .fullbox p { margin: 0 0 10px 0; padding: 0 10px 0 10px; } #mc_right .fullbox ul { padding: 0 0 10px 10px; margin: 0; list-style: none; } #mc_right .fullbox ul li{ margin: 0 0 5px 0.5em; background-image: url(/assets/images/bullet_small_blue.gif); background-position: 0 5px; background-repeat: no-repeat; padding: 0 0 0 1.0em; color: #00349b; font-weight: bold; font-size: 14px; } #mc_right .fullbox h4{ font-size: 18px; font-weight: bold; margin: 0 0 10px 0; padding: 0 0 0 10px; } #mc_right .fullbox ol{ display:inline; float:left; position: relative; margin-bottom: 10px; } #mc_right .fullbox ol li { height: 53px; width: 173px; display:inline; float:left; position: relative; margin: 0 0 0 10px; padding: 0; list-style: none;} #mc_right .fullbox ol li p { display: none; } #mc_right .fullbox ol li#step1 { background: #fff url(/assets/images/li_orderstep_1.jpg) 0% 0% no-repeat; } #mc_right .fullbox ol li#step2 { background: #fff url(/assets/images/li_orderstep_2.jpg) 0% 0% no-repeat; } #mc_right .fullbox ol li#step3 { background: #fff url(/assets/images/li_orderstep_3.jpg) 0% 0% no-repeat; } /*---------------------------------------------------------- 06. FOOTER ---------------------------------------------------------- */ #footer { clear:both; margin: 10px 0 20px 0; padding: 10px 0 0 0; border-top: solid 1px #80b3e5; width: 100%;} #footer h1 { color:#9ccdfd; float: left; width: 550px; margin: 0; padding: 10px 0 0 0; border: solid 0px #f00; height: 25px; } #footer h2 { color: #fef687; float: right; width:200px; background-image: none; margin: 0; padding: 0; border: solid 0px #f00; height: 35px; font-size: 24px; font-weight: bold;} #footer ul#footerlist1 { margin: 10px 20px 0 0; display:inline; float:left; position: relative; } #footer ul#footerlist1 li { display:inline; float:left; position: relative; margin: 0 5px 0 0px; padding: 0 5px 0 0; list-style: none; border-right: solid 1px #fff; height:10px; line-height: 10px;} #footer ul#footerlist1 li.last{ border-right-width:0px;} #footer ul#footerlist1 li a{ color: #fff; font-weight: bold; text-decoration: none; } #footer ul#footerlist2 { margin: 8px 20px 0 0; display:inline; float:left; position: relative; } #footer ul#footerlist2 li { display:inline; float:left; position: relative; margin: 0 5px 0 0px; padding: 0 5px 0 0; list-style: none; height:10px; line-height: 10px;} #footer ul#footerlist2 li a{ color: #fff; text-decoration: none; }