/* GLOBAL */ body { margin:0px; padding:0px; font-family:"Lucida Grande", Tahoma, sans-serif; background-color:#f9f9f9; } div { float:left; font-size:13px; } ul { display:block; float:left; padding:0px; margin:0px; list-style:none; } li { display:block; float:left; padding:0px; margin:0px; } li a, li label { display:block; float:left; } table { border-collapse:collapse; width:100%; } td { padding:0px; vertical-align:top; } .helvetica { font-family:Helvetica, Arial, sans-serif; } .b-grain { background:#383838 url('images/b-grain.png') repeat left top; color:#fff; } .b-grid { background:#ccf7ff url('images/b-grid.png') repeat left top; color:#30576d; } .b-wood { background:#a3917f url('images/b-wood.jpg') repeat left top; color:#fff; } a { text-decoration:none; color:#333;} a:hover { color:#666;} #body { background:#fff url('images/background.png') no-repeat left top; border-bottom:1px solid #f4f4f4; width:100%; padding-bottom:40px; } #container { width:960px; padding:0px 20px; } #content { width:100%; position:relative; } #stamp-top { position:absolute; top:0px; left:0px; z-index:10000; width:960px; height:4px; background-image:url('images/stamp-top.png'); } #stamp-bottom { position:absolute; bottom:0px; left:0px; z-index:10000; width:960px; height:4px; background-image:url('images/stamp-bottom.png'); } /* HEAD */ #head { width:100%; height:140px; } h1 { display:block; float:left; margin:0px; padding:0px; } h1 a { display:block; float:left; width:180px; height:80px; text-indent:-1000px; font-size:13px; background:transparent url('images/logo.png') no-repeat left top; } h1 a:hover { opacity:0.5; } #head ul a { font-size:14px; color:#444; font-weight:bold; height:100px; line-height:100px; padding:0px 10px; } #head ul a:hover { color:#666; } #head ul a.active { color:#fff; background:transparent url('images/menu-active.png') repeat-x 50% bottom; } #tools { float:right; } #tools a { display:block; float:left; padding:3px 5px; text-transform:capitalize; color:#bbb; } #tools a:hover { color:#888; } #tools a.active { background-color:#fc0; color:#fff; } #basket { display:block; float:left; padding:5px 10px; margin-top:36px; margin-left:20px; background-color:#30576d; color:#fff; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } #basket:hover { background-color:#163d55; } /* HOME */ #featured { position:relative; background-color:#444; margin-bottom:10px; } #featured .slides { width:960px; oveflow:hidden; } #featured .slide img { display:block; float:left; width:720px; height:300px; } #featured .slide div { display:block; float:right; width:210px; height:260px; padding:20px 15px; font-size:20px; } #featured .dots { position:absolute; top:270px; right:96px; z-index:1000; } .dots a { display:block; outline:none; width:16px; height:16px; text-indent:-1000px; float:left; background:transparent url('images/featured-dots.png') no-repeat left top; cursor:pointer; } .dots a.activeSlide { background-position:left bottom; } .welcome { font-size:22px; padding:20px; width:440px; } #list.home { width:420px; padding:20px 30px; } /* CATALOGUE */ #submenu { width:240px; padding:20px 0px; } #submenu li { width:100%; } #submenu a { height:40px; float:right; padding:0px 20px; color:#163d55; font-size:20px; line-height:40px; } #submenu a:hover { color:#436b80; } #submenu a.active { color:#fff; background:transparent url('images/submenu-active.png') no-repeat left top; } .b-wood #submenu a { color:#fff; text-shadow:#000 0px 1px 3px; } .b-wood #submenu a.active { text-shadow:none; } #list_text { padding:30px; padding-bottom:0px; font-size:24px; text-shadow:#000 0px 1px 3px; line-height:100%; } #list { width:700px; padding:20px 10px; } #list a { position:relative; background-color:#fff; color:#444; margin:15px; width:100px; padding:5px; font-size:13px; line-height:150%; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; -moz-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow:0px 5px 5px rgba(0, 0, 0, 0.5); } #list a img { width:100px; height:100px; margin-bottom:5px; } #list a .price { color:#888; } #list a:hover { background-color:#ccf7ff; color:#30576d; } #list a:hover .price { color:#3f779a; } #list.projects { padding:20px 15px; width:690px; } #list.projects a { width:190px; } #list.projects img { width:190px; height:120px; } #nav { position:relative; margin:-5px -10px 0px 0px; float:right; } #nav a { opacity:0.75; display:block; float:left; height:20px; width:20px; overflow:hidden; text-indent:-1000px; } #nav #prev { background-image:url('images/nav-prev.png'); } #nav #next { background-image:url('images/nav-next.png'); } #nav a:hover { opacity:1; } .badge { position:absolute; top:85px; left:-1px; width:112px; padding-bottom:6px; background:transparent url('images/badge-shadow.png') no-repeat 50% bottom; } .badge span { display:block; float:left; width:112px; height:20px; font-size:11px; font-weight:bold; text-align:center; line-height:20px; color:#fff; } .badge.sale span { background-color:#40afff; } .badge.soldout span { background-color:#ff4040; } #image { position:relative; width:480px; oveflow:hidden; background-color:#fff; } #image img { display:block; float:left; width:480; height:480; } #image #pager { display:none; position:absolute; top:235px; right:0px; width:auto; z-index:1000; padding:5px; background-image:url('images/black.png'); } #desc { width:200px; height:440px; padding:20px; position:relative; } #desc h2 { font-size:28px; font-weight:bold; margin:0px; margin-bottom:5px; line-height:90%; } #desc p { margin:0px; margin-bottom:15px; } #desc .price { font-size:24px; color:#3f779a; } .strike {text-decoration: line-through;} #pager { font-size:44px; line-height:30px; color:#fff; width:100%; text-align:center; padding-bottom:20px; } #pager i, #pager a { display:inline-block; width:30px; height:30px; overflow:hidden; text-indent:-1000px; background-repeat:no-repeat; background-position:left top; } #pager i { background-image:url('images/pager-slash.png'); } #pager a#prev { background-image:url('images/pager-prev.png'); } #pager a#next { background-image:url('images/pager-next.png'); } #pager a:hover { background-position:left bottom; } #add { display:block; float:left; width:200px; position:absolute; left:0px; bottom:0px; padding:20px; } #add td { padding-bottom:10px; } a.submit { display:block; float:left; width:199px; height:40px; text-align:center; line-height:40px; font-weight:bold; font-size:16px; color:#fff; background-color:#30576d; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } a.submit:hover { background-color:#163d55; } #selected_pattern { white-space:nowrap; } #patterns { display:none; position:absolute; z-index:2000; bottom:0px; left:720px; width:240px; height:480px; overflow:hidden; } #patterns ul { background-color:#a3917f; } #patterns li { position:relative; -moz-box-shadow:0px 2px 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow:0px 2px 2px rgba(0, 0, 0, 0.5); } #patterns li a { height:20px; display:block; width:240px; opacity:0.5; background-position:left bottom; } #patterns li a span { display:none; float:left; background-color:#fff; color:#444; padding:7px 5px 5px 5px; width:230px; font-size:11px; text-align:center; } #patterns li a:hover span { display:block; } #patterns .buttons { padding:10px; width:220px; position:absolute; bottom:0px; left:0px; } /* CHECKOUT */ #steps { font-size:14px; width:100%; border-bottom:1px solid #9aebff; background-color:#30576d; color:#a1b5c0; -moz-border-radius:10px; -webkit-border-radius:10px; -moz-border-radius-bottomleft:0px; -webkit-border-bottom-left-radius:0px; -moz-border-radius-bottomright:0px; -webkit-border-bottom-right-radius:0px; } #steps span { display:block; float:left; padding:15px 20px; } #steps span.active { font-weight:bold; color:#fff; padding-left:60px; background:transparent url('images/checkout-arrow.png') no-repeat left 50%; } #steps li:first-child span.active { background-image:none; padding-left:20px; } #steps img { position:relative; margin-bottom:-2px; margin-right:5px; } #step { width:100%; background-color:#eee; } #step #help { width:200px; padding:20px; font-size:13px; } #step #help strong { font-size:20px; font-weight:normal; } #step #form { width:679px; padding:20px; } fieldset { border:0px; padding:0px; margin:0px; width:340px; float:left; } fieldset:last-child { width:339px; } fieldset div { width:100%; height:40px; } fieldset label { width:100px; height:19px; line-height:19px; margin-right:20px; float:left; display:block; text-align:right; } fieldset .input { margin:0px; border:0px; padding:2px 2px; height:15px; width:195px; } fieldset .optional { color:#3f779a; font-size:9px; } #methods li { background-color:#fff; color:#444; position:relative; padding:10px; width:179px; height:139px; margin-right:21px; margin-bottom:21px; } #methods li.active { background-color:#30576d; color:#fff; } #methods h3 { margin:0px; margin-bottom:20px; font-size:16px; } #methods label { position:absolute; padding-top:10px; bottom:10px; left:10px; right:10px; line-height:24px; cursor:pointer; border-top:1px dotted #eee; } #methods .price { font-size:24px; float:right; } #note { margin-top:20px; } #note label { float:left; width:100%; } #note textarea { width:300px; } #agreement { float:right; margin-top:20px; } #agreement a { color:#30576d; font-weight:bold; } #agreement a:hover { text-decoration:underline; } #resume { background-color:#fff; padding:50px 100px; width:479px; } #resume h2 { margin:0px; } #step #buttons { width:100%; } #step #buttons a { margin:20px; } #step #buttons a.fw { float:right; margin-right:21px; } #step #buttons a.white { color:#30576d; background-color:#fff; } #step #buttons a.white:hover{ color:#163d55; } #step #buttons a.order { background-color:#000; } .zebra { background-color:#fff; color:#222; border-bottom:2px solid #163d55; } .zebra td:first-child, .zebra th:first-child { border-left-width:0px; } .zebra td, .zebra th { padding:10px; border-bottom:1px solid #ddd; border-left:1px dotted #ddd; vertical-align:middle; } .zebra tbody tr { background-color:#f9f9f9; } .zebra tbody tr.even { background-color:#f5f5f5; } .zebra tfoot td { background-color:#fff; padding:20px 10px; } .zebra .image { padding:0px; width:50px; } .zebra .image img { width:50px; height:50px; } .zebra .options div { margin-right:10px; } .zebra .total { font-size:24px; } .zebra a { color:#888; } .remove { display:block; opacity:0.5; width:15px; height:15px; overflow:hidden; text-indent:-1000px; background-image:url('images/checkout-remove.png'); } .remove:hover { opacity:1; } /* TEXT */ #text { background-color:#ffb; color:#504200; padding:50px 100px; position:relative; width:468px; border:1px solid #fff178; line-height:160%; } #text h2 { font-size:30px; } #text span { font-size:18px; font-weight:bold; } .margin { width:50px; } /* CONTACT */ #contact { width:200px; padding:20px; } .button { color:#fff; font-size:11px; padding:3px 5px 4px 5px; display:inline-block; position:relative; background-color:#30576d; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .button:hover { background-color:#163d55; } /* FOOT */ #foot { padding:20px; } #foot div { width:220px; padding-right:20px; font-size:9px; color:#bbb; line-height:150%; } #foot a { color:#888; } #foot a:hover { color:#bbb; } a.social { font-size:9px; display:block; height:14px; float:left; padding-left:19px; margin-right:10px; background-position:left top; background-repeat:no-repeat; } a.social:hover { background-position:left bottom; } a#twitter { background-image:url('images/foot-twitter.png'); } a#facebook { background-image:url('images/foot-facebook.png'); }