/* ----------[ GRID OVERWRITE & GENERAL STYLES ]---------- */ html {background: #ababab url(../../common/images/temp/body.gif) 0 0 repeat-x; } body {text-align: center;} #custom-doc { width:980px; margin:auto; text-align:left; font: normal 100% arial;} #primary {width: 330px; float: left;} #secondary {width: 330px; float: right;} /*a {color: #009999;}*/ a {color:darkgray;text-decoration: none; font-family:Verdana;} a:hover {color: #666;} ul.marker, ul.marker-list {list-style-type:none;} ul.marker li {margin:0 0 5px; line-height:1.1em; background: url(../../common/images/temp/bullet.gif) -10px 3px no-repeat; padding-left: 20px;} ul.marker-list li {margin:0 0 5px; line-height:1.1em; background: url(../../common/images/temp/bullet2.gif) 0 5px no-repeat; padding-left: 12px;} ul.marker li a, ul.marker-list li a {color:#fff; font:normal 85% arial; text-decoration: none;} ul.marker li a:hover, ul.marker-list li a:hover {text-decoration: underline;} ul.marker li span, ul.marker-list li span {color:#434343; font-size:77%;} ul.marker li.callout {background:0; margin-bottom:15px;} ul.marker li.callout span {display:block; margin-bottom:5px;} ul.marker li.callout a {padding:0;} ul.marker li.callout a.more {display:inline; text-align:left; font-weight:normal; font-size:85%; color:#990e0e;} ul.marker li.callout .relatedimg {float:left; margin:0 8px 8px 0;} ul.marker li.callout {overflow:hidden; zoom:1; margin-bottom:7px;} .more ul.marker li.callout {margin-bottom:0;} ul.marker li.callout p { margin-bottom:5px; } #primary ul.marker li span {color:#7C7C7C;} ul.marker li cite {font-size:90%; color:#7C7C7C;} .list-module h3 {background: url(../../common/images/temp/lozenge.gif) 0 0 no-repeat; height: 16px; width: 166px; padding: 2px 0 0 20px; color: #CEFEFF; font: bold 85% arial; margin-bottom: 10px;} .list-module ul {margin-left: 20px; margin-bottom: 10px;} .list-module .description {font: normal 85% arial; color: #fff; margin-left: 20px; margin-bottom: 10px;} .search-module {margin-bottom: 5px;} .search-module label {display:none;} /** * Copyright (c) 2006-2007, Bill W. Scott * All rights reserved. * * This work is licensed under the Creative Commons Attribution 2.5 License. To view a copy * of this license, visit http://creativecommons.org/licenses/by/2.5/ or send a letter to * Creative Commons, 543 Howard Street, 5th Floor, San Francisco, California, 94105, USA. * * This work was created by Bill Scott (billwscott.com, looksgoodworkswell.com). * * The only attribution I require is to keep this notice of copyright & license * in this original source file. * * Version 0.6.1 - 07.08.2007 * */ /** * Standard Configuration. It is advised that this section NOT be modified as the * carousel.js expects the behavior outlined below. **/ .carousel-component { position:relative; overflow:hidden; /* causes the clipping */ display:none; /* component turns it on when first item is rendered */ } .carousel-component ul.carousel-list { width:10000000px; position:relative; z-index:1; } .carousel-component .carousel-list li { float:left; list-style:none; overflow:hidden; } /** * VERTICAL CAROUSEL DEFAULTS **/ .carousel-component .carousel-vertical li { margin-bottom:0px; /* Fix for extra spacing in IE */ float:left; clear:left; /* Force the LI to respect the HEIGHT specified */ overflow:hidden; display:block; } /* For vertical carousel, not set, width defaults to auto */ /* Note if you explicitly set width to auto, this might cause */ /* problems with Safari... as in up/down button not working in some examples. */ .carousel-component ul.carousel-vertical { /* width:auto;*/ } .carousel-component .carousel-clip-region { overflow:hidden; /* Secret to the clipping */ margin:0px auto; position:relative; } /** * ============================================================================== * Safe to override. It is safe to override background, padding, margin, color, * text alignment, fonts, etc. Define a separate CSS file and override your style * preferences. **/ .carousel-component { background:#e2edfa; padding:0px; -moz-border-radius:6px; color:#618cbe; } .carousel-component ul.carousel-list { margin:0px; padding:0px; line-height:0px; } .carousel-component .carousel-list li { text-align:center; margin:0px; padding:0px; font:10px verdana,arial,sans-serif; color:#666; } .carousel-component .carousel-vertical li { } .carousel-component ul.carousel-vertical { } /* ----------[ /GRID OVERWRITE & GENERAL STYLES ]---------- */ /* ----------[ MASTHEAD STYLES ]---------- */ #masthead {padding-top: 10px;} #masthead h2#logo {} #masthead h2#logo a {display:block; background: url(../../common/images/temp/logo.gif) 0 0 no-repeat; width: 300px; height: 0; padding-top: 56px; overflow:hidden; text-indent: -999em;} /* -----[ NAV STYLES ]----- #nav {margin-top: 15px; margin-bottom: 5px;} #nav ul {margin-left: 150px; margin-bottom: 15px;} #nav ul li {float: left; margin: 0 20px;} #nav ul li.search {margin-top: -5px;} #nav ul li a {color: #c1c1c1; font: bold 93% arial; text-decoration: none; text-decoration: none; width: 57px; display: block;} #nav ul li.selected a, #nav ul li a:hover {color: #666;} #nav ul li label {display:none;} -----[ /NAV STYLES ]----- */ /* -----[ NAV STYLES ]----- */ #nav {margin-top: 15px; margin-bottom: 5px;} #nav ul {margin-left: 150px; margin-bottom: 15px;} #nav ul li {float: left; margin: 0 26px;} #nav ul li.search {margin-top: -5px;} #nav ul li a {color: #c1c1c1; font: bold 93% arial; text-decoration: none; text-decoration: none; display: block;} #nav ul li.selected a, #nav ul li a:hover {color: #666;} #nav ul li label {display:none;} /* -----[ /NAV STYLES ]----- */ /* ----------[ /MASTHEAD STYLES ]---------- */ .clraccount { padding-top: 10px; padding-left:100px; height: 56px; text-align: right; float: right; vertical-align: top; } /* ----------[ HOMEPAGE STYLES ]---------- */ /* .homepage #bd {background: url(../../common/images/temp/home_bg.jpg) 0 0 no-repeat; width: 980px; height: 580px; margin-bottom: 20px;} */ .homepage #bd {text-align: center;} .homepage #bd .home-img {margin: 0 auto; padding: 25px 0 40px;} /* ----------[ /HOMEPAGE STYLES ]---------- */ /* ----------[ COLLECTION STYLES ]---------- */ #product-stage {margin-bottom: 20px;} #product-stage #stage {background-color: #fff; margin-bottom: 15px; border: 1px solid #adadad;} #product-stage #stage #image-container {float: left; margin: 20px;} #product-stage #stage #image-nfo {text-align: right; float: right; margin-top: 50px; margin-right: 60px; width: 250px;} #product-stage #stage #image-nfo h2 {font: bold 182% arial; margin-bottom: 15px;} #product-stage #stage #image-nfo .desc {margin-bottom: 15px;} #product-stage #stage #image-nfo .dimensions {margin-bottom: 15px;} #product-stage #stage h3 {font-weight: bold;} #product-stage #product-carousel {background-color: #fff; text-align:center;} #product-stage #product-carousel .hd {display: none;} #product-stage #product-carousel #baglist {margin: 0 auto;} #baglist.carousel-component { padding:8px 16px 4px 16px; margin-top:20px; background-color: #fff; } .carousel-component .carousel-list li { margin:4px; width:79px; /* img width is 75 px from flickr + a.border-left (1) + a.border-right(1) + img.border-left (1) + img.border-right (1)*/ height:100px; /* image + row of text (87) + border-top (1) + border-bottom(1) + margin-bottom(4) */ /* margin-left: auto;*/ /* for testing IE auto issue */ } .carousel-component .carousel-list li.on, .carousel-component .carousel-list li.selected { border: 1px solid #adadad; margin: 3px; } .carousel-component .carousel-list li a { display:block; border:0; outline:none; } .carousel-component .carousel-list li img { border:0; display:block; } .carousel-component .carousel-prev { position:absolute; top:50px; z-index:3; cursor:pointer; left:5px; } .carousel-component .carousel-next { position:absolute; top:50px; z-index:3; cursor:pointer; right:5px; } /* ----------[ /COLLECTION STYLES ]---------- */ /* ----------[ SHOP STYLES ]---------- */ .shop #bio {background: #fff url(../../common/images/temp/shop_bg1.jpg) 20px 60px no-repeat; border: 1px solid #adadad; margin-bottom: 20px; } .shop #bio .hd {text-align:center;} .shop #bio .hd h1 {font: bold 132% arial; color: #adadad; margin: 20px;} .shop #bio .bd {padding-top: 25px; padding-left: 500px; height: 497px;} .shop #bio .bd p {color: #666; margin: 10px 30px 20px 20px;} /* ----------[ /SHOP STYLES ]---------- */ /* ----------[ STYLESNEW ]---------- */ .storesnew #storeinfo {background: #fff url(../../common/images/temp/store_bg.jpg) 140px 100px no-repeat; border: 1px solid #adadad; margin-bottom: 20px; } .storesnew #storeinfo .hd {text-align:center;} .storesnew #storeinfo .hd h1 {font: bold 132% arial; color: #adadad; margin: 20px;} .storesnew #storeinfo .bd {text-align:center;height: 520px;} .storesnew #storeinfo p {color: #666; margin: 10px 30px 20px 20px;} /* ----------[ /STYLESNEW ]---------- */ /* ----------[ ABOUT and STORES STYLES ]---------- */ .about #bio, .stores #storeinfo {background: #fff url(../../common/images/temp/about_bg.jpg) 20px 60px no-repeat; border: 1px solid #adadad; margin-bottom: 20px; } .about #bio .hd, .stores #storeinfo .hd {text-align:center;} .about #bio .hd h1, .stores #storeinfo .hd h1 {font: bold 132% arial; color: #adadad; margin: 20px;} .about #bio .bd, .stores #storeinfo .bd {padding-top: 25px; padding-left: 450px; height: 497px;} .about #bio .bd p, .stores #storeinfo p {color: #666; margin: 10px 30px 20px 20px;} /* ----------[ /ABOUT STYLES ]---------- */ /* ----------[ CONTACT INFO ]---------- */ .contact #contactinfo, .contact #contact-success {background: #fff url(../../common/images/temp/contact_bg.jpg) 520px 40px no-repeat; border: 1px solid #adadad; margin-bottom: 20px; height: 750px;} .contact #contactinfo .contact-address, .contact #contactinfo .contactform {margin: 40px;} .contact #contactinfo .contact-address h3, .contact #contactinfo .contactform h3 {font: bold 132% arial; color: #999;} .contact #contactinfo .contactform li {margin: 10px 0 15px;} .contact #contactinfo .contactform label {display: block; text-align: right; width: 90px; margin-right: 10px; float: left;} .contact #contactinfo .contactform .submitbtn {margin-left: 100px;} .contact #contactinfo #promo-mailinglist {background-color: #eee; margin: 40px; width: 400px; padding: 20px; text-align: center;} .contact #contact-success h2 {font: bold 132% arial;} .contact #contact-success h2, .contact #contact-success p {margin: 20px;} /* ----------[ /CONTACT INFO ]---------- */ /* ----------[ MAILLIST STYLES ]---------- */ .maillist #maillistform {background: #fff url(../../common/images/temp/maillist_bg.jpg) center 60px no-repeat; border: 1px solid #adadad; margin-bottom: 20px; height: 580px; text-align: center;} .maillist #maillistform h1 {font: bold 132% arial; color: #adadad; margin: 20px;} .maillist #maillistform p {margin-top: 450px; font: bold 132% arial; color: #adadad; margin-bottom: 15px;} .maillist #maillistform .form-maillist {width: 400px; margin: 0 auto;} .maillist #maillistform .form-maillist li {margin: 10px 0 15px;} .maillist #maillistform .form-maillist label {display: block; text-align: right; width: 90px; margin-right: 10px; float: left;} .maillist #maillistform .form-maillist input#email, .maillist #maillistform .form-maillist .submitbtn {float: left; margin-right: 10px;} .contact #contactinfo #promo-mailinglist {background-color: #eee; margin: 40px; width: 400px; padding: 20px; text-align: center;} /* ----------[ /MAILLIST STYLES ]---------- */ /* ----------[ SHARE LIST ]---------- */ #share-list {margin-bottom: 15px;} #share-list h3 {background: url(../../common/images/temp/lozenge.gif) 0 0 no-repeat; height: 16px; width: 166px; padding: 2px 0 0 20px; color: #CEFEFF; font: bold 85% arial; margin-bottom: 10px;} #share-list ul.bd li {float: left; margin: 0 10px;} #share-list ul.bd li a {display: block; height: 0; width: 16px; padding-top: 16px; overflow: hidden;} #share-list ul.bd li a.digg {background: url(../../common/images/temp/icon-digg.gif) 0 0 no-repeat;} #share-list ul.bd li a.delicious {background: url(../../common/images/temp/icon-delicious.gif) 0 0 no-repeat;} #share-list ul.bd li a.stumbleupon {background: url(../../common/images/temp/icon-stumbleupon.gif) 0 0 no-repeat;} #share-list ul.bd li a.reddit {background: url(../../common/images/temp/icon-reddit.gif) 0 0 no-repeat;} #share-list ul.bd li a.newsvine {background: url(../../common/images/temp/icon-newsvine.gif) 0 0 no-repeat;} /* ----------[ /SHARE LIST ]---------- */ /* ----------[ FOOTER STYLES ]---------- */ #ft {padding-bottom: 200px;} #copyfoot {background-color: #595959;color: #ccc; padding-bottom: 10px; -moz-border-radius: 0 0 10px 10px; -webkit-border-radius: 0 10px;} #copyfoot p.ctxt {width: 350px; font: normal 77% verdana; float: left; margin: 10px 10px 0;} #copyfoot ul {float: right; width: 250px; margin: 10px 10px 0;} #copyfoot ul li {float: left; font: normal 77% verdana;} #copyfoot ul li a {color: #ccc; text-decoration: none;} #copyfoot ul li a:hover {text-decoration: underline;} /* ----------[ /FOOTER STYLES ]---------- */ .wm {font: normal 77% helvetica, arial; padding-left: 10px;} .wm a {color: #38161E;} /* ----------[ CLEARFIX BLOCK ]---------- */ .navlist #arcade, .navlist h3 {zoom:1;} .navlist #arcade:after, .navlist h3:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } /* ----------[ /CLEARFIX BLOCK ]---------- */ /* ----------[ CLEARFIX FLOAT FIX ]---------- */ .clrfx{ zoom:1; } .clrfx:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } /* ----------[ /CLEARFIX FLOAT FIX ]---------- */ .test {border: 1px solid red;} .predebug {text-align: left; background-color: #fff; border: 1px solid #666; position: absolute; top: 700px; left: 50px; height: 300px; width: 900px; overflow: scroll; z-index: 999;} .hide {display:none;} .dmargin {margin:0 0 7px;} .temp {color: #fff;} .temp a {color: #fff;}