/** * KAKART * The Jewellery Stop * * Dave Worth , Jon Ellis-Jones * (c) 2009 Kaweb Ltd. */ @import url('/skin/thejewellerystop/style/thejewellerystop.fancybox.css'); a:focus { outline: none; } * { margin:0; padding:0;} body { font-family: 'Lucida sans', 'Lucida Grande', Arial, sans-serif; font-size: 78%; /*text-align:center; background:#FFF url('/skin/thejewellerystop/image/layout/bkgd.jpg') repeat-x 0 0;*/ padding:0 0 0 0; } img { border:none;} p, .list, td, th{ color:#58595b; line-height:1.4em; font-size:.9em;} p { margin-bottom:1.1em; } blockquote { font-size:1.5em; margin-left:60px; border-left:1px solid #666; padding-left:15px;} blockquote p { color:#545454} .list { margin:0 0 1.2em 0; } .list li { padding:.2em 0; } .list ul, .list ol { margin-left:2em;} ul { list-style: url(/skin/thejewellerystop/image/standard/bullet.png); list-style-position: 2px 2px; } a, a:visited { color:#58595b;} a:hover { color:#c41c70; text-decoration:none;} h1 { width:194px; height:127px; display:block; text-indent:-999em; margin:0; /*background:url('/skin/thejewellerystop/image/layout/logo.png') no-repeat 0 0;*/ position:absolute; top:0px; right:0; } h1 span { width:194px; height:127px; display:block; text-indent:-999em; cursor:pointer; } h2 { } h3 { font-weight:normal; color:#305c4f; margin:0 0 .5em 0; font-size:1.7em} h4 { font-size:1.2em; font-weight:bold; margin:0 0 .5em; color:#305c4f;} /* ---------------------------- */ /* Minor Classes */ /* ---------------------------- */ .txt-small { font-size:0.8em;} .txt-medium { font-size:1.2em;} .txt-large { font-size:1.4em;} .txt-xlarge { font-size:1.9em;} .txt-uppercase { text-transform:uppercase; } .txt-grey { color:#777} .txt-black { color:#000} .txt-pink { color:#c41c70;} /* ---------------------------- */ /* LAYOUT */ /* ---------------------------- */ #container { text-align:left; width:945px; margin:0 auto;} #header-pad { padding-top: 15px; position: relative;} #header { position:relative; background:url('/skin/thejewellerystop/image/layout/bkgd-header.png') no-repeat 0 0; height:161px; } #header p.tel { position:absolute; right:75px; bottom:12px; margin:0; width: 110px;} #content { clear:both; margin-top:20px; margin-left:0px; } #col-left { float:left; width:148px; margin-right:15px; padding-top:15px; } #col-right { float:left; width:752px; margin-top: -10px} #cnt-col-left { float:left; width:576px; margin-right:6px; } #cnt-col-right { float:left; width:205px; } #footer { background:url('/skin/thejewellerystop/image/layout/bgkd-footer.png') no-repeat 0 0; clear:both; height:42px; position:relative; width:937px; } #footer.valentines { background-image: url('/skin/thejewellerystop/image/promo/promo-footer.png'); height: 120px;} #footer.valentines .footer-nav { margin-top: 35px;} #footer.valentines .website-info { margin-top: 35px;} #footer.valentines .final-text { margin-top: 35px;} #footer.mothers { background-image: url('/skin/thejewellerystop/image/promo/promo-footer.png'); height: 120px;} #footer.mothers .footer-nav { margin-top: 35px;} #footer.mothers .website-info { margin-top: 35px;} #footer.mothers .final-text { margin-top: 35px;} #footer.maymadness { background-image: url('/skin/thejewellerystop/image/promo/promo-footer.png'); height: 120px;} #footer.maymadness .footer-nav { margin-top: 18px;} #footer.maymadness .website-info { margin-top: 18px;} #footer.maymadness .final-text { margin-top: 18px;} #footer.vogue { background-image: url('/skin/thejewellerystop/image/promo/promo-footer.png'); height: 120px;} #footer.vogue .footer-nav { margin-top: 29px;} #footer.vogue .website-info { margin-top: 29px;} #footer.vogue .final-text { margin-top: 29px;} /* ---------------------------- */ /* HOME */ /* ---------------------------- */ body.home #content { margin-left: 0; } body.home #col-left { padding-top: 0; margin-right: 10px; } body.home #col-right { margin-top: -10px; width: 787px; } #content.about #col-right { margin-top: -10px; width: 782px; } #content.about #col-right #cnt-col-left { width: 571px; } #content.shift-up { margin-top: 10px; } ul.home-prodThumbs {} ul.home-prodThumbs li { list-style:none; float:left; position:relative;} ul.home-prodThumbs li img { position:absolute; left:8px; top:8px;} ul.home-prodThumbs li a { display:block; width:114px; height:114px; text-decoration:none; cursor:pointer} ul.home-prodThumbs a span.border { background:url('/skin/thejewellerystop/image/layout/shadow-home.png') no-repeat 0 0; display:block; width:114px; height:114px; position:absolute; top:0; left:0; margin:0; } ul.home-prodThumbs a:hover span.border { background-position:0 -114px;position:absolute; top:0; left:0; } div.promo { background:url('/skin/thejewellerystop/image/home/bkgd-panel-bottom.png') no-repeat left bottom; } div.promo-child { background:url('/skin/thejewellerystop/image/home/bkgd-panel-top.png') no-repeat 0 0; padding:25px 11px 25px 11px; } div.promo h2 { font-family:Georgia, "Times New Roman", Times, serif; color:#58595b; margin:0 15px; font-weight:normal; font-size:1.4em; } div.promo p { margin:0 15px;} div.promo p.home-newsTitle { font-size:1em; font-weight:bold; margin-bottom:5px;} /* ---------------------------- */ /* LEFT NAV */ /* ---------------------------- */ a.return-search, a.return-search:visited { text-transform:uppercase; font-size:.8em; display:block; margin:-24px 0 20px 19px} #left-block { background:url('/skin/thejewellerystop/image/layout/bkgd-leftBlock-top.png') no-repeat 0 0; padding-top:15px; } #left-block-child { background:url('/skin/thejewellerystop/image/layout/bkgd-leftBlock-bottom.png') no-repeat left bottom; padding:0 8px 8px 8px; } #left-block a { text-decoration:none;} #left-block ul.hidden { display: none; } #left-block ul.shown { display: block; } #left-block a.cat-title { display:block; background-position:0 0; background-repeat:no-repeat; height:13px; color:#FFF; font-size:.9em; padding:3px 8px; margin: 8px 0 5px 0;} #left-block a.cat-title.top-element { margin-top: 0 !important; } #left-block a.cat-title:hover { background-position:0 -19px;} #left-block a.close { background-image:url('/skin/thejewellerystop/image/navigation/left-titleBkgd-close.png')} #left-block a.up { background-image:url('/skin/thejewellerystop/image/navigation/left-titleBkgd-up.png')} #left-block a.down { background-image:url('/skin/thejewellerystop/image/navigation/left-titleBkgd-down.png')} #left-block ul.categories { list-style:none; font-size:.9em; } #left-block ul.categories li { display:inline} #left-block ul.categories li a { background:url('/skin/thejewellerystop/image/navigation/left-circles-gap.png') no-repeat 0 2px; padding:3px 0 3px 22px; display:block; } #left-block ul.categories li a:hover { background-position:0 -34px; color:#c41c70; } #left-block ul.categories li.active a { background-position:0 -34px;} /* ---------------------------- */ /* SEARCH RESULTS */ /* ---------------------------- */ #search-tools { position:relative; margin:20px 0 20px 15px; } #search-tools form { width:400px; position:relative} a.show-compare-tool { position:absolute; top:2px; left:407px; font-size:.9em; } ul.search-results { } ul.search-results li { list-style:none; float:left; margin:0 30px 10px 0; position:relative; width:165px; padding-top:155px; } ul.search-results li.last { margin-right:0;} ul.search-results li span { margin:0 8px 0 15px; font-size:.9em; display:block;} ul.search-results li span.title { margin-top:-5px; margin-bottom:3px; font-weight: bold; height: 15px; overflow: hidden; } ul.search-results li span.price { color:#c41c70; font-weight:bold;} ul.search-results a { text-decoration:none; cursor:pointer } ul.search-results a img { position:absolute; top:12px; left:12px;} ul.search-results a span.border { background:url('/skin/thejewellerystop/image/layout/shadow-results.png') no-repeat 0 0; display:block; width:165px; height:165px; position:absolute; top:0; left:0; margin:0; } ul.search-results a:hover { color:#000;} /*ul.search-results a:hover img { opacity:.7; -ms-filter:"alpha(opacity=70)"; filter: alpha(opacity=70); zoom:1;}*/ ul.search-results a:hover span { z-index:9999; position:relative;} ul.search-results a:hover span.border { background-position:0 -165px; position:absolute; top:0; left:0; } ul.search-results .border .sticker { position: absolute; top: -5px; right: -8px; background: url(/skin/thejewellerystop/image/standard/sticker-blank-sml.png) top left no-repeat; display: block; width: 55px; height: 55px; color: #fff; } ul.search-results .border .sticker span { padding-top: 17px; margin: 0; font-size: 9px; text-transform: uppercase; text-align: center; } /* Pagination */ /* ---------------------------- */ ul.pagination { position:absolute; right:5px; top:2px;} ul.pagination li { list-style:none; float:left; margin-left:5px; color:#6a6a6a; font-size:.9em; text-align:left; } ul.pagination li a, ul.pagination li a:visited { color:#6a6a6a; text-decoration:none; } ul.pagination li.active a, ul.pagination li a:hover { text-decoration:underline; color:#c41c70 } ul.pagination li.first a, ul.pagination li.previous a, ul.pagination li.next a, ul.pagination li.last a, div.slide-parent a.slide-button, span.next a, span.prev a { display:block; width:15px; height:15px; text-indent:-999em; background-position:0 0; background-repeat:no-repeat; } span.next a { background-image:url('/skin/thejewellerystop/image/pagination/next.png'); } span.prev a { background-image:url('/skin/thejewellerystop/image/pagination/previous.png'); } ul.pagination li.first a { background-image:url('/skin/thejewellerystop/image/pagination/first.png');} ul.pagination li.previous a, div.slide-parent a.previous { background-image:url('/skin/thejewellerystop/image/pagination/previous.png');} ul.pagination li.next a, div.slide-parent a.next { background-image:url('/skin/thejewellerystop/image/pagination/next.png')} ul.pagination li.last a { background-image:url('/skin/thejewellerystop/image/pagination/last.png')} ul.pagination li.first a:hover, ul.pagination li.previous a:hover, ul.pagination li.next a:hover, ul.pagination li.last a:hover, div.slide-parent a.slide-button:hover, span.next a:hover, span.prev a:hover { background-position:0 -15px; } ul.pagination-bottom { position:absolute; right:0; bottom:20px; } /* ---------------------------- */ /* PRODUCT PAGE */ /* ---------------------------- */ body.product #cnt-col-left { width:272px; float:left; text-align:center; clear:both; margin-top: 20px;} body.product #cnt-col-middle { width:300px; float:left; margin:0 25px 0 10px; margin-top: 20px;} body.product #cnt-col-right { float:left; width:135px; text-align:center;} .old-price { color: #424242; display: inline; text-decoration: line-through; margin: 0; padding-left: 5px; } .old-price.product { font-size: 0.9em;} div.slide-parent { position:relative; } div#matching-items { /* margin-top:15px; */ } div.slide-parent a.slide-button { position:absolute;} div.slide-parent a.next { right:0;} div.slide-parent a.previous { left:0} div#colours-available a.slide-button { top:42px;} div#matching-items a.slide-button { top:52px;} body.product #cnt-col-left h3 { text-align:center; font-size:1em; text-transform:uppercase; letter-spacing:.1em; margin-bottom:5px;} body.product #cnt-col-left ul { margin-left:20px; } body.product #cnt-col-left ul li { list-style:none; float:left; margin-right:4px; text-align:center} body.product #cnt-col-left ul li { margin-right:8px;} body.product #cnt-col-left ul li.last { margin-right:0 !important;} body.product #cnt-col-left ul li a { text-decoration:none; color:#c41c70; font-weight:bold; font-size:.9em;} body.product #cnt-col-left ul li a:hover { color:#000; } body.product #cnt-col-left ul li a:hover img { opacity:.7; -ms-filter:"alpha(opacity=70)"; filter: alpha(opacity=70); zoom:1; } body.product #cnt-col-middle h2 { font-size:2em; font-weight:normal; color:#000; font-family:Georgia, "Times New Roman", Times, serif} body.product #cnt-col-middle p.collection { font-size:1.2em; font-family:Georgia, "Times New Roman", Times, serif; margin-bottom:.5em} body.product #cnt-col-middle p.product-price { font-size:2em; font-weight:bold; color: #747679; } body.product #cnt-col-middle a.action-btn,input.action-btn { display:block; background-position:0 0; background-repeat:no-repeat; width:190px; height:80px; text-indent:-999em; } body.product #cnt-col-middle a.add-bag,input.add-bag { background-image:url('/skin/thejewellerystop/image/navigation/btn-addBag.png'); } body.product #cnt-col-middle a.add-bag:hover,input.add-bag:hover { background-position:0 -87px;} body.product #cnt-col-middle a.add-favourites,input.add-favourites { background-image:url('/skin/thejewellerystop/image/navigation/btn-addFavourites.png'); height:35px; } body.product #cnt-col-middle a.add-favourites:hover,input.add-favourites:hover { background-position:0 -35px;} body.product #cnt-col-right div.promo { background:url('/skin/thejewellerystop/image/layout/bkgd-thinBox-bottom.png') no-repeat left bottom; padding:0;} body.product #cnt-col-right div.promo-child { background:url('/skin/thejewellerystop/image/layout/bkgd-thinBox-top.png') no-repeat 0 0; padding:25px 9px 15px 9px; } body.product #cnt-col-right div.promo ul { margin-top:10px;} body.product #cnt-col-right div.promo p { font-size:.8em;} body.product #cnt-col-right div.promo ul li { list-style:none; margin-bottom:10px;} body.product #cnt-col-right div.promo ul li a { color:#c41c70; font-size:.9em; font-weight:bold; text-decoration:none;} body.product #cnt-col-right div.promo ul li a:hover { color:#000;} body.product #cnt-col-right div.promo ul li a:hover img { opacity:.7; -ms-filter:"alpha(opacity=70)"; filter: alpha(opacity=70); zoom:1;} body.product .product-sticker { background: url(/skin/thejewellerystop/image/standard/sticker-blank-sml.png) top left no-repeat;width: 55px; height: 55px; color: #fff; position: absolute; right: -14px; top: 18px;} body.product .product-sticker span { padding-top: 14px; display: block; margin: 0; font-size: 9px; text-transform: uppercase; text-align: center; } /* ---------------------------- */ /* FORMS */ /* ---------------------------- */ /* General */ /* ---------------------------- */ form fieldset { padding:0; margin:0; border:none;} form ul { list-style:none;} form label { font-size:.9em; color:#6a6a6a; display:block; width:98px; margin-right:10px; text-align:left; float:left; padding-top:4px;} form option { padding:0 3px} form .field-help { padding-top: 2px; font-size: 8pt; clear: left; margin-left: 110px; color: #6a6a6a; margin-bottom: 5px;} /* Search Form */ /* ---------------------------- */ form.fm-search { position: absolute; top: 75px; left: 320px;} form.fm-search label { display:none;} form.fm-search input { border:1px solid #FFF;} form.fm-search input#search { width:285px; padding:4px; border:1px solid #FFF; font-size:1.1em; color:#aaaaaa; } form.fm-search input.submit { display:none;} /* Search Results */ /* ---------------------------- */ #search-tools form ul { } #search-tools form li { float:left; margin-right:40px; } #search-tools form label { display:none; } #search-tools form option { font-size:.9em; } /* Product Options */ /* ---------------------------- */ form.product-options { margin-top:20px;} form.product-options li { margin-bottom:10px;} form.product-options label { display:none;} form.product-options {} /* Live Search */ /* ---------------------------- */ div.live-search-results { width:280px; border:2px solid #999; background-color:#FFF; position:absolute; z-index:9999!important; } div.live-search-results li { list-style:none;} div.live-search-results li a { display: block; text-decoration: none; color: #6a6a6a; padding: 8px 7px 7px 92px; font-size:.8em; min-height: 76px; height: auto !important; height: 76px; position: relative; border-bottom: 1px solid #999; } div.live-search-results li.odd a { background-color:#F9F6F1;} div.live-search-results li a .search-image-holder { width: 75px; height: 75px; position: absolute; left: 7px; top: 8px; } /*div.live-search-results li a span { font-family:Georgia, "Times New Roman", Times, serif; }*/ div.live-search-results li a span.title { font-family:Georgia, "Times New Roman", Times, serif; font-size: 1.6em; } div.live-search-results li a span.price { font-size: 1.2em; color: #c41c70; } div.live-search-results li a:hover { background-color: #ededed; color: #000; } div.live-search-results div#search-numberResults, div.live-search-results div#search-numberResults a, div.live-search-results div#search-numberResults a:visited { background-color:#999; color:#FFF; padding:3px 0; text-align:center; font-size:.9em;} div.live-search-results div#search-numberResults { width:280px} input#search.searching { background: #fff url(/skin/thejewellerystop/image/standard/loading-small.gif) center right no-repeat; } /* ---------------------------- */ /* NAVIGATION */ /* ---------------------------- */ /* Primary */ /* ---------------------------- */ ul.main-nav { position:absolute; bottom:24px; left:35px;} ul.main-nav li { list-style:none; float:left; margin-right:12px; padding-right:12px; } ul.main-nav li.last { margin-right:0; padding-right:0; border:none; background-image:none;} ul.main-nav li a, ul.main-nav li a:visited { text-decoration:none; color:#58595b; font-size:1em; display:block; font-size:.9em; } ul.main-nav li a:hover, ul.main-nav li a:visited:hover, ul.main-nav li.active a { color:#c41c70; } /* Top Nav */ /* ---------------------------- */ ul.top-nav { position:absolute; right:75px; top:10px;} ul.top-nav li { list-style:none; margin-bottom:2px; padding:0 0 3px 10px; } ul.top-nav li.your-bag { background:url('/skin/thejewellerystop/image/navigation/bkgd-yourBag-purple.png') no-repeat 0 0; height: 15px; padding-top: 1px;} ul.top-nav li a { text-decoration:none; font-size:.9em; color:#000;} ul.top-nav li.your-bag a { color:#FFF;} #shopping-bag { width:46px; height:75px; background:url('/skin/thejewellerystop/image/navigation/bag-header.png') no-repeat 0 0; position:absolute; right:35px; top:45px; text-align:center; } #shopping-bag span { color:#FFF; font-weight:bold; text-decoration:underline; position:relative; top:28px; left:15px; font-size:1.2em; width:25px; display:block;} #shopping-bag a { color: inherit; text-decoration: none !important; } ul.top-nav li a:hover { text-decoration:underline} /* Sub Nav */ /* ---------------------------- */ #left-block a.title, #left-block h3 { font-family: Georgia, "Times New Roman", Times, serif; font-size:1.4em; color:#c41c70; display:block; padding:15px 0 0 10px; margin-top: 0;} #left-block a.first, #left-block h3.first { padding-top: 0;} #left-block p { } #left-block a.title:hover { color: #000; } ul.sub-nav { font-family:Georgia, "Times New Roman", Times, serif; margin:5px 0 0 25px; } ul.sub-nav li { list-style:none; margin-bottom:5px;} ul.sub-nav li a { text-decoration:none; font-size:1.1em;} /* Breadcrumb */ /* ---------------------------- */ ul.breadcrumb { margin-left:15px; margin-bottom: 10px;} ul.breadcrumb li { float:left; list-style:none; font-size:.8em; color:#58595b; padding-right:4px;} ul.breadcrumb li.last { color:#c41c70} ul.breadcrumb li a { color:#58595b; padding-right:2px; } /* Footer */ /* ---------------------------- */ #footer ul { position:absolute; top:14px;} #footer ul li { list-style:none; float:left; padding-right:10px; margin-right:10px; border-right:1px solid #FFF; font-size:.8em; color:#FFF;} #footer ul li.last { padding:0; margin:0; border:none;} #footer ul li a { text-decoration:none; color:#FFF; } #footer ul.footer-nav { left:20px; } #footer ul.website-info { right:20px; } ul.circle-style { list-style:none; font-size:.9em; } ul.circle-style li { display:inline} ul.circle-style li a { background:url('/skin/thejewellerystop/image/navigation/left-circles.png') no-repeat 0 2px; padding:3px 0 3px 22px; display:block; } ul.circle-style li a:hover { background-position:0 -21px; color:#c41c70; } ul.circle-style li.active a { background-position:0 -21px;} .cat-title.none { background-image: url(/skin/thejewellerystop/image/navigation/left-titleBkgd-none.png); display: block; background-position: 0 0; background-repeat: no-repeat; height: 13px; color: #FFF; font-size: .9em; padding: 3px 8px; margin: 0px 0 5px 0; } ul.menu-points { list-style: square; font-size: 0.9em; color: #6a6a6a; line-height: 17px; margin-left: 14px; } /** JON */ ul.checkout-steps { list-style: none; font-size: 11px; line-height: 16px; } ul.checkout-steps li { padding-left: 4px; } ul.checkout-steps li.active span { color: #C41C70; } ul.checkout-steps li.active { font-weight: bold; } ul.checkout-steps li.inactive span { color: #808080; } ul.checkout-steps li.inactive { color: #aaa; } .padless { padding-top: 0px !important; } .rounded-outer { background: #ddd; padding: 6px; width: 400px; margin: 12px 0 0 0; } .rounded-inner { padding: 10px; background: #eee; text-align: center; } li.address { display: block; float: left; width: 220px; margin: 0 12px 0 0; } li.address a { color: #333; text-decoration: none; display: block; background: #ddd; height: 174px; } li.address a:hover { background: #888; } li.address .internal { display: block; background: #fff; margin: 6px; padding: 7px; height: 148px; } li.address a:hover .internal div { border-color: #888 !important; } li.address .internal strong { display: block; border-bottom: solid 1px #ddd; line-height: 1.8em; padding: 0 0 2px 3px; } li.address .internal strong .default { color: #C41C70; float: right; padding-right: 4px; } li.address .internal .address_text { display: block; padding: 4px 4px 2px 4px; line-height: 1.7em; } .header h3 { border-bottom: 1px solid #aeaeae; padding: 0 0 6px 0; } /* formz*/ #form-login ul { text-align: left; width: 342px; margin: 12px auto 0; } #form-login legend { display: none; } #form-login li.first-row { margin: 5px 0; } #form-login label { width: 100px; line-height: 22px; padding: 0; } #form-login input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-login input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-login .error label { color: #cc0000; } #form-login .error input { } #form-login a.lost-pw { float: right; line-height: 30px; padding-right: 6px; text-decoration: none; font-size: 0.8em; } #form-login a.register { text-decoration: none; font-size: 0.8em; } #form-login .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-login .header .left-col { float: left; text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-login .header .right-col { float: right; } #form-login ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 326px; } #form-login ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-register ul { text-align: left; width: 342px; margin: 12px auto 0; } #form-register legend { display: none; } #form-register li.first-row { margin: 5px 0; } #form-register label { width: 100px; line-height: 22px; padding: 0; margin-bottom: 5px;} #form-register input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-register input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-register .error label { color: #cc0000; } #form-register .error input { } #form-register a.lost-pw { float: right; line-height: 30px; padding-right: 6px; text-decoration: none; font-size: 0.8em; } #form-register a.register { text-decoration: none; font-size: 0.8em; } #form-register .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-register .header .left-col { float: left; text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-register .header .right-col { float: right; } #form-register ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 326px; } #form-register ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-register li.check-row input { width: auto; margin-left: 0px; margin-top: 4px; float: left; } #form-register li.check-row label { margin-left: 10px; width: auto; } #form-favourites ul.fields { text-align: left; width: 340px; margin: 12px auto 0; } #form-favourites legend { display: none; } #form-favourites ul.fields li.first-row { margin: 5px 0; } #form-favourites label { width: 100px; line-height: 22px; padding: 0; } #form-favourites input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-favourites textarea { width: 335px; height: 40px; padding: 2px 0 0 1px;} #form-favourites input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-favourites .error label { color: #cc0000; } #form-favourites .error input { } #form-favourites .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-favourites .header .left-col { float: left; text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-favourites .header .right-col { float: right; } #form-favourites ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 650px; } #form-favourites ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-favourites li.check-row input { width: auto; margin-left: 0px; float: left; } #form-favourites li.check-row label { margin-left: 10px; width: auto; } #form-address { width: 355px;} #form-address ul { text-align: left; width: 342px; margin: 0 0 0; } #form-address legend { display: none; } #form-address li.first-row { margin: 5px 0; } #form-address label { width: 100px; line-height: 22px; padding: 0; } #form-address input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-address input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-address .error label { color: #cc0000; } #form-address .error input { } #form-address .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-address .header .left-col { float: left; text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-address .header .right-col { float: right; } #form-address ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 287px; } #form-address ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-support ul { text-align: left; width: 742px; margin: 12px 20px 0; } #form-support legend { display: none; } #form-support li.first-row { margin: 5px 0; } #form-support label { width: 100px; line-height: 22px; padding: 0; } #form-support input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-support textarea { width: 530px; height: 100px; padding: 2px 0 0 1px;} #form-support input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-support .error label { color: #cc0000; } #form-support .error input { } #form-support .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; width: 686px;} #form-support .header { text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-support ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 636px; } #form-support ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-account ul { text-align: left; width: 342px; margin: 12px 20px 0; } #form-account legend { display: none; } #form-account li.first-row { margin: 5px 0; } #form-account label { width: 100px; line-height: 22px; padding: 0; } #form-account input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-account input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-account .error label { color: #cc0000; } #form-account .error input { } #form-account .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-account .header { text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-account ul.error-holder { margin: 12px 0 12px 18px; background: #ddd; padding: 6px; width: 326px; } #form-account ul.error-holder li { color: #333; font-size: 0.9em; line-height: 1.5em; } #form-checkout ul.error-holder { padding: 0 4px; } #form-checkout ul.error-holder li { color: #6a6a6a; font-size: 0.9em; line-height: 1.5em; } #form-checkout ul li label { border-right: 3px solid #fff; margin-right: 5px; width: 100px; font-size: 8pt;} #form-checkout ul li.error label { border-right: 3px solid #800;} #form-checkout .form-address ul { text-align: left; width: 342px; margin: 12px 20px 0; } #form-checkout .form-address legend { display: none; } #form-checkout .form-address li.first-row { margin: 5px 0; } #form-checkout .form-address label { width: 100px; line-height: 22px; padding: 0; } #form-checkout .form-address input { width: 180px; height: 15px; padding: 2px 0 0 1px; } #form-checkout input.button { margin: 8px 0 8px 0px; width: auto; height: auto; padding: 4px 14px; clear: left; } #form-checkout .form-address .error label { color: #cc0000; } #form-checkout .form-address .error input { } #form-checkout .form-address .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-checkout .form-address .header { text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-lostpassword a.lost-pw { float: right; line-height: 30px; padding-right: 6px; text-decoration: none; font-size: 0.8em; } #form-lostpassword a.register { text-decoration: none; font-size: 0.8em; } #form-lostpassword .header { border-bottom: solid 1px #aeaeae; padding: 0 0 6px 0; } #form-lostpassword .header .left-col { float: left; text-transform: uppercase; font-weight: bold; font-size: 1em; color: #58595b; } #form-lostpassword .header .right-col { float: right; } #form-lostpassword ul { text-align: left; width: 342px; margin: 12px auto 0; } #form-lostpassword legend { display: none; } #form-lostpassword li.first-row { margin: 5px 0; } #form-lostpassword label { width: 100px; line-height: 22px; padding: 0; } #form-lostpassword input { width: 220px; height: 15px; padding: 2px 0 0 1px; } #form-lostpassword input.button { margin: 8px 0 8px 110px; width: auto; height: auto; padding: 4px 14px; } #form-lostpassword .error label { color: #cc0000; } #form-lostpassword .error input { } #form-lostpassword legend { display: none; } #form-lostpassword p { margin-top: 10px; text-align: left;} .loading { background: url(/skin/thejewellerystop/image/standard/loading.gif) no-repeat center center; } div.image-error { text-align: center; padding-top: 120px; margin: 0 auto; position: static !important; color: #808080; } table.jewellery-bag { width: 100%; margin: 24px 0; } table.jewellery-bag thead th { text-transform: uppercase; border-bottom: solid 1px #cbcbcb; padding: 3px 5px 5px 5px; font-size: 1.0em; text-align:right;} table.jewellery-bag thead th.center { text-align: center; } table.jewellery-bag tbody td.price { text-align: right; } table.jewellery-bag tbody tr.item td { padding: 10px 0 17px; border-bottom: solid 1px #cbcbcb; } table.jewellery-bag td.quantity { font-size: 1.2em; } table.jewellery-bag tbody td.center { text-align: center; } table.jewellery-bag tbody td.center input { margin: 0 auto; } .jewellery-bag a.remove-item { overflow: hidden; text-indent: -48px; background: url(/skin/thejewellerystop/image/navigation/remove-item.png) top left no-repeat; display: block; width: 16px; height: 16px; } .jewellery-bag a.remove-item:hover { background-position: 0 -23px;} tbody .item .image75x75 { margin: 0 6px 0 0; float: left; height: 75px; } tbody .item .image75x75 img { display: block; } tbody .item .product { float: left; height: 72px; padding: 3px 0 0 3px; } tbody .item .product .name { display: block; font-family: 'Georgia', serif; color: #191919; font-size: 1.75em; padding: 2px 0 4px 0;} tbody .item .product .name a { text-decoration: none; } tbody tr.empty td { text-align: center; background: #eaeaea; padding: 12px; font-size: 1.1em; height: 85px; } tbody .monetary, tfoot .monetary { font-size: 1.2em; color: #535353; padding-right: 2px; } tfoot td { padding: 2px 0; } tfoot td.first-row { padding-top: 5px; } tfoot td.last-row { padding-bottom: 5px; } tfoot .grand-total { font-weight: bold; } /* img picker */ ul.image-picker { position: absolute; bottom: 18px; left: 0px; } ul.image-picker li { float: left; padding: 0; margin-right: 2px !important; } ul.image-picker li a { background: url(/skin/thejewellerystop/image/navigation/left-circles-trans.png) 0 0px no-repeat; display: block; width: 16px; height: 16px; } ul.image-picker li a:hover, ul.image-picker li.active a { background-position: 0 -23px; } ul.image-picker.hidden { display: none; } /* frame tools */ .frame-tools .magnify { position: absolute; bottom: 12px; right: 17px; } .frame-original { display: block; margin-bottom: 2px; width: 75px; height: 75px; } span.no-picture { position: absolute; height: 75px; width: 75px; line-height: 75px; text-align: center; left: 0; color: #999; } /* Home Page: Rotating Image Holder */ .rotate { display: block; margin: 0; padding: 0; width: 576px; height: 311px; cursor: pointer; } .rotate li { display: block; width: 576px; height: 311px; padding: 0; margin: 0; position: absolute; } .rotate li a { text-decoration: none; } .rotate li .border { display: block; width: 576px; height: 311px; background: url(/skin/thejewellerystop/image/home/main-promo-border.png) top left no-repeat; } .rotate li .border .space { display: block; height: 192px; } .rotate li .outer { width: 553px; margin: 0 0 0 12px; display: table; height: 84px; #position: relative; overflow: hidden; background: url(/skin/thejewellerystop/image/home/main-image-white-panel2.png) top left repeat-x; } .rotate li .middle { position: absolute; top: 67%; display: table-cell; vertical-align: middle; } .rotate li .inner { color: #333; display: block; text-align: left; padding-left: 23px; #position: relative; #top: -50%; vertical-align: middle; font-size: 1.6em; font-style: italic; font-family: 'Georgia', 'Times', serif; } .image-container { width: 256px; height: 256px; margin-left: 7px; margin-top: -20px;} .image-container .actual-image { display: block; position: absolute; top: 7px; left: 7px; } /* Favourites */ ul.favourites-list li { list-style:none; position:relative; clear: left;} ul.favourites-list li img { position:absolute; left:8px; top:8px; } ul.favourites-list li a.favourite { display:block; height:114px; text-decoration:none; cursor:pointer; float: left; width: 400px;} ul.favourites-list li span.favourite-info { float: left; height: 94px; padding-top: 20px; margin-left: 120px; display: block;} ul.favourites-list li span.favourite-info span.favourite-name { font-size: 1.2em; font-family: Georgia, "Times New Roman", Times, serif; margin-bottom: 0.5em; display: block;} ul.favourites-list a span.border { background:url('/skin/thejewellerystop/image/layout/shadow-home.png') no-repeat 0 0; display:block; width:114px; height:114px; position:absolute; top:0; left:0; margin:0; } ul.favourites-list a:hover span.border { background-position:0 -114px;position:absolute; top:0; left:0; } ul.favourites-list div.favourite-remove-link { float: left; margin-top: 40px; background: #f0f0f0; padding: 4px;} ul.favourites-list span.favourite-price { font-size:1.2em; font-weight:bold; color:#c41c70; display: block; margin-top: 8px;} span.favourites-email-cnt { background: #ddd; padding: 5px; float: left; cursor: pointer;} span.favourites-email-cnt.open { cursor: default;} span.favourites-email-cnt.hover { background: #c41c70; color: white; } span.favourites-email-cnt .email-link { padding: 5px; width: auto; } span.favourites-email-cnt .email-form { padding: 5px; background: #eee; display: none; width: 697px;} .fav-checkbox { position: absolute; bottom: 17px; right: 17px; width: 16px; height: 16px; background: url(/skin/thejewellerystop/image/navigation/left-circle-trans.png); display: none; } .fav-remove { position: absolute; bottom: 17px; left: 17px; width: 16px; height: 15px; background: url(/skin/thejewellerystop/image/navigation/remove-item.png); display: block; } .fav-remove:hover, .fav-remove.hover { background-position: 0px -23px;} .final-text { position: absolute; top: 48px; font-size: 0.8em; padding: 0px 10px; color: #6a6a6a; line-height: 15px;} .final-text a { text-decoration: underline; } .final-text a:hover { color: #c41c70;} /*.search-results a:hover .fav-checkbox { background-position: 1px -21px;}*/ .search-results a .fav-checkbox.selected { background-position: 1px -21px; } /* Extra form stuff */ ul.fields li { clear: left; padding: 2px 0;} .padless { padding-top: 0 !important; } #content.about #cnt-col-left ul { margin: 30px; font-size: 0.9em; color: #6a6a6a;} #content.about #cnt-col-left ul li { line-height: 150%; padding: 2px 0;} #content.account .text-page-padded ul { margin: 15px 30px; font-size: 0.9em; color: #6a6a6a;} #content.account .text-page-padded ul li { line-height: 150%; padding: 2px 0;} .add-favourites-tip { display: none; width: 180px; text-align: center; color: #c41c70; } .text-page-padded { padding: 15px; padding-top: 10px; padding-right: 30px;} .text-page-padded h2 { font-family:Georgia, "Times New Roman", Times, serif; color:#58595b; margin:0 0 15px 0px; font-weight:normal; font-size:1.4em; } .text-page-padded h3 { text-transform: uppercase; color: #58595b; font-size: 1em; font-weight: bold;} /* orders */ div.header.bordered { border-bottom: 1px solid #aeaeae; margin: 5px;} ul.tabbed { padding: 0px 0px; margin: 0px 5px 0px 15px; list-style: none;} ul.tabbed li { } ul.tabbed li a { display: block; float: left; padding: 5px 10px 5px 10px; background: #eee; margin-right: 10px; text-decoration: none; font-weight: bold; text-transform: uppercase; font-size: 0.9em;} ul.tabbed li a:hover, ul.tabbed li.active a { background: #fff; } table.jewellery-kvs { width: 100%; margin: 24px 0; } table.jewellery-kvs th { text-transform: uppercase; padding: 5px 0 5px 5px; font-size: 1.0em; text-align: right; padding-right: 15px; vertical-align: top; } table.jewellery-kvs td { padding: 5px 0 5px 5px;} div.order-progress-label { width: 20%; float: left; font-size: 0.9em; padding: 5px; text-transform: uppercase; font-weight: bold; padding-top: 10px; color: #6a6a6a;} ul.order-progress { padding: 0; margin: 0; list-style: none; background: #fff; margin-top: 5px; width: auto; float: right;} ul.order-progress li { display: block; float: left; padding: 0px 10px; margin: 5px 0; text-decoration: none; font-weight: bold; text-transform: uppercase; font-size: 0.9em; color: #aaa; text-align: center; border-right: 1px solid #aaa;} ul.order-progress li.last { border-right: 0;} ul.order-progress li.achieved { color: #c41c70; } ul.order-progress li.problem { color: #800;} /* contact */ div.contact #left-block a.title { cursor: pointer; font-size:1.05em; width:110px; } #map { margin:4px auto 10px; border:1px solid #999999 } .address { float:left; margin-left:12px; width:203px } #contactform { width:300px; float:left; } #contactform input, #contactform textarea { border: 1px solid #999999; margin: 2px 0; font-family:Arial, Helvetica, sans-serif; font-size:1em; padding:2px; width:185px; } .georgia { font-family:Georgia, "Times New Roman", Times, serif } h2.georgia { font-weight:normal; color:#666666 } ul.errors li { color:#C41C70 } hr.contact { border:0; margin:5px 0 20px; padding:0; border-top:1px solid #666; } #contactform label { margin-top:5px } #contactform input.submit { margin-left:108px; width:auto } a.branchselected{ color:#666666!important } #storemap{ float:right; margin:0; margin-left:20px; border:1px solid #CCCCCC } .ticket-header { cursor: pointer; color: #58595b; } .ticket-header .opener { float: left; width: 5%; } .ticket-header .opener span { } .ticket-header h3 { float: left; } .ticket-status { float: left; width: 15%; text-align: center;} .ticket-activity { float: left; width: 30%; text-align: right; float: right;} .ticket-unread { float: left; width: 40%; } /*******************************/ /********* bubbletip ***********/ /*******************************/ .bubbletip { position: absolute; z-index: 50; border-collapse: collapse; } .bubbletip td.bt-topleft { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll 0px 0px; height: 33px; width: 33px; } .bubbletip td.bt-top { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-T-B.png) repeat-x scroll 0px 0px; height: 33px; } .bubbletip td.bt-topright { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll -73px 0px; height: 33px; width: 33px; } .bubbletip td.bt-left-tail div.bt-left, .bubbletip td.bt-left { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-L-R.png) repeat-y scroll 0px 0px; width: 33px; } .bubbletip td.bt-left-tail div.bt-left-tail { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll 0px -33px; width: 33px; height: 40px; } .bubbletip td.bt-right-tail div.bt-right, .bubbletip td.bt-right { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-L-R.png) repeat-y scroll -33px 0px; width: 33px; } .bubbletip td.bt-right-tail div.bt-right-tail { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll -73px -33px; width: 33px; height: 40px; } .bubbletip td.bt-bottomleft { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll 0px -73px; height: 33px; width: 33px; } .bubbletip td.bt-bottom { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-T-B.png) repeat-x scroll 0px -33px; height: 33px; } .bubbletip td.bt-bottomright { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll -73px -73px; height: 33px; width: 33px; } .bubbletip table.bt-top, .bubbletip table.bt-bottom { width: 100%; } .bubbletip table.bt-top th { width: 50%; background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-T-B.png) repeat-x scroll 0px 0px; } .bubbletip table.bt-bottom th { width: 50%; background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip-T-B.png) repeat-x scroll 0px -33px; } .bubbletip table.bt-top td div { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll -33px 0px; width: 40px; height: 33px; } .bubbletip table.bt-bottom td div { background: transparent url(/skin/thejewellerystop/image/bubbletip/bubbletip.png) no-repeat scroll -33px -73px; width: 40px; height: 33px; } .bubbletip td.bt-content { background-color: #fff; } /*******************************/ /* sticky footer */ html,body,#container { height: 100% !important; } #wrapper { min-height: 100%; height: auto !important; height: 100%; margin-bottom: -128px !important; } #footer, #push { height: 88px; margin-top: 0; } #push { height: 108px;} /* --------------------- */ .clearfix:after { content: "."; /* the period is placed on the page as the last thing before the div closes */ display: block; /* inline elements don't respond to the clear property */ height: 0; /* ensure the period is not visible */ clear: both; /* make the container clear the period */ visibility: hidden; /* further ensures the period is not visible */ } /*.clearfix {display: inline-block;} /* a fix for IE Mac */ /* next a fix for the dreaded Guillotine bug in IE6 */ /* Hides from IE-mac \*/ html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /* end of "no-extra-markup" clearing method */