/* ************************************************* Wines Controller Styles Author: andCulture, info@andCulture.com Updated: May 27, 2009 Notes: None ************************************************* */ /*------------------------------------------- SHARED -------------------------------------------*/ /* DETAILS LINK */ ul li p a.wine-details { font-size: 10px; font-weight: bold; text-decoration: none; text-transform: uppercase; } ul li p a.wine-details:after { content: " \00BB"; font-size: 1.2em; } /* ICONS */ ul.icons { margin: 6px 0 0 0; padding: 0; list-style: none; } ul.icons li { margin: 0 7px 7px 0; width: 30px; height: 30px; float: left; background: url(../images/icons/wine_icon_matrix.png); text-indent: -9999px; } ul.icons li.color { width: 24px; } ul.icons li.rose { background-position: -35px 0; } ul.icons li.white { background-position: -70px 0; } ul.icons li.full { background-position: -105px 0; } ul.icons li.medium { background-position: -140px 0; } ul.icons li.light { background-position: -175px 0; } ul.icons li.apricot { background-position: -210px 0; } ul.icons li.astringent { background-position: -245px 0; width: 29px; } ul.icons li.blackcherry { background-position: -280px 0; width: 28px; } ul.icons li.blackberry { background-position: -315px 0; width: 24px; } ul.icons li.butter { background-position: -350px 0; } ul.icons li.chocolate { background-position: -420px 0; width: 19px; } ul.icons li.floral { background-position: -455px 0; width: 29px; } ul.icons li.grapefruit { background-position: -490px 0; width: 29px; } ul.icons li.greenapple { background-position: -525px 0; width: 26px; } ul.icons li.honey { background-position: -560px 0; width: 28px; } ul.icons li.lemonlime { background-position: -595px 0; width: 26px; } ul.icons li.pear { background-position: -630px 0; width: 20px; } ul.icons li.redapple { background-position: -665px 0; width: 26px; } ul.icons li.redcherry { background-position: -385px 0; width: 29px; } ul.icons li.spice { background-position: -700px 0; width: 29px; } ul.icons li.strawberry { background-position: -735px 0; width: 22px; } ul.icons li.vanilla { background-position: -770px 0; width: 20px; } ul.icons li.vegetal { background-position: -805px 0; width: 19px; } /* ACTIONS */ div.actions h6 { margin: 0 0 10px 0; display: none; color: #4F504B; font-size: 20px; font-weight: bold; } /* BUTTONS */ div.default button.add-to-cart, div.in-cart button.in-cart, div.not-available button.not-available, div.error button.not-available, div.error h6 { display: block !important; } /* UL */ div.actions ul { margin: 0; padding: 0; float: left; clear: left; list-style: none; } div.actions ul li { margin: 10px 0; padding: 0; } div.actions ul li.remove { display: none; } div.actions ul li a { padding: 2px 0 2px 17px; color: #6e6f66; text-decoration: underline; } div.actions ul li a:hover { background-position: 0 -85px !important; color: #565750; } div.actions ul li.friend a { background: url(../images/icons/action_arrow.png) 0 3px no-repeat; } div.actions ul li.remove a { background: url(../images/icons/action_remove.png) 0 3px no-repeat; } div.actions ul li.save a { background: url(../images/icons/action_add.png) 0 3px no-repeat; } /* IN WISHLIST */ div.actions.in-wishlist ul li.save { display: none; } div.actions.in-wishlist ul li.remove { display: block; } /*------------------------------------------- WINE SEARCH RESULTS PAGE -------------------------------------------*/ body.best-sellers h1 { background-position: 0 -600px; } body.wines h2 { margin: 0 0 5px 0; height: 15px; text-indent: -9999px; background: url(../images/titles/content_subtitle_matrix.png) no-repeat; } /* CONTROL BARS */ div.c-bar { padding: 7px 0; } div#c-bar-top { border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; } /* SORTING */ p.sort { margin: 0; float: left; } p.sort select { font-size: 11px; } /* PAGINATION */ form.pagination { font-size: 11px; line-height: 18px; } form.pagination span.pages input { padding: 2px 3px; border: 1px solid #f0037f; background: none; color: #F0037F; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bold; text-indent: 0; } form.pagination span.pages input:hover { border-color: #ae0b60; color: #ae0b60; } form.pagination div { display: none; } form.pagination.first input.previous, form.pagination.last input.next { border-color: #d7d7d7 !important; background: #DDD; color: #FFF !important; cursor: default; } form.pagination span.pages span { margin: 0 10px; } /* GO TO PAGE */ form.pagination span.goto label { margin-left: 10px; } form.pagination span.goto input { margin: 0 5px; padding: 2px; width: 15px; font-size: 11px; text-align: center; } form.pagination span.goto button { width: 26px; height: 20px; background: url(../images/buttons/go.gif); } /* CONTROL BAR VARIATIONS */ div#c-bar-top form.pagination { float: right; } div#c-bar-bottom span.pages { float: left; } div#c-bar-bottom span.goto { float: right; } /* SEARCH RESULT STRING */ p#result-string { margin: 4px 0; font-size: 11px; } /* ALPHABET SORT */ p#alpha { letter-spacing: 2px; display: none; } p#alpha a { text-decoration: none; } /* NO RESULTS*/ body.no-results h2, body.no-results div.c-bar { display: none; } div.no-wines p { font-size: 16px; line-height: 24px; } /* WINE LIST */ ul.wine-list { margin: 0; padding: 0; border-bottom: 1px solid #CCC; clear: both; list-style: none; } ul.wine-list > li { margin: 0; padding: 15px 0 15px 65px; min-height: 130px; border-top: 1px solid #CCC; position: relative; } ul.wine-list li:first-child { border-top: none; } ul.wine-list li h4 { margin: 14px 0 0 0; width: 390px; font-size: 24px; font-weight: normal; line-height: 1; } ul.wine-list li p { margin-bottom: 0; width: 390px; font-size: 12px; } ul.wine-list li img { position: absolute; top: 15px; left: 0; } ul.wine-list li input { clear: both; } /* RELEVANCY BAR */ ul.wine-list div.relevancy { width: 50px; height: 130px; position: absolute; left: 0; top: 15px; background: #EEE; } ul.wine-list div.relevancy span.fill { border-bottom: solid 0 #f0037f; display: block; } ul.wine-list div.relevancy span.value { width: 100%; display: block; position: absolute; left: 0; color: #FFF; font-size: 12px; line-height: 1; text-align: center; text-transform: uppercase; } ul.wine-list div.relevancy span.value span { font-size: 20px; font-weight: bold; } ul.wine-list div.relevancy span.value span sup { font-size: 12px; vertical-align: top; } /* DETAILS */ ul.wine-list li ul.details { width: 630px; height: 0; position: absolute; left: 65px; top: 15px; } ul.wine-list li ul.details li { font-size: 10px; } ul.wine-list li ul.details li.price { float: right; font-size: 36px; font-weight: bold; line-height: 1; } ul.wine-list li ul.details li.price sup { padding: 0 1px 0 0; font-size: 20px; } /* ICONS */ ul.wine-list li ul.icons { width: 283px; } /* ACTIONS */ ul.wine-list div.actions { position: absolute; top: 60px; right: 0; } ul.wine-list button { height: 29px; display: none; } ul.wine-list button.add-to-cart { width: 156px; background-position: -200px 0; } ul.wine-list button.in-cart { width: 128px; background-position: -200px -30px; } ul.wine-list button.not-available { width: 109px; background-position: -200px -90px; } ul.wine-list button.processing { width: 128px; background-position: 0 -40px; } /* ROW VARIATIONS */ ul.wine-list li div.actions.default { width: 156px; } ul.wine-list li div.actions.in-cart { width: 128px; } ul.wine-list li div.actions.not-available, ul.wine-list li div.actions.error { width: 109px; } ul.wine-list li div.actions.processing { width: 128px; } /* RELEVANCY VARIATION */ ul.wine-list.show-relevancy > li { margin: 0; padding-left: 125px; } ul.wine-list.show-relevancy li h4 { width: 325px; } ul.wine-list.show-relevancy li p { width: 325px; } ul.wine-list.show-relevancy li img { left: 60px; } ul.wine-list.show-relevancy li ul.details { width: 570px; left: 125px; } /*------------------------------------------- WINE DETAIL PAGE -------------------------------------------*/ body.wine-details h1 { margin: .375em 0 8px 0; padding: 0 170px 5px 0; border-bottom: 1px solid #CCC; height: auto; background: none; color: #f0037f; font-size: 32px; font-weight: normal; line-height: 1em; text-indent: 0; } /* DETAILS */ body.wine-details ul.details { width: 305px; float: left; } body.wine-details ul.details li { margin-bottom: 15px; padding: 2px 10px; border-left: 1px solid #CCC; } body.wine-details ul.details li.varietal { padding: 0; width: auto; border-left: none; position: absolute; top: -2px; left: 0; } body.wine-details ul.details li.vintage { border-left: none; padding-left: 0; } body.wine-details ul.details li.price { margin-left: -4px; margin-right: 12px; padding: 0; border-left: 0; clear: left; font-size: 40px; font-weight: bold; color: #4f504b; } body.wine-details ul.details li.price sup { padding-left: 4px; font-size: 25px; top: 3px; } body.wine-details ul.details li.best-seller/*, body.wine-details ul.details li.featured */ { margin-left: 3px; padding: 0; border-left: none; } body.wine-details ul.details li.best-seller a/*, body.wine-details ul.details li.featured a */ { height: 20px; display: block; background: url(../images/tags.png); text-indent: -9999px; } body.wine-details ul.details li.best-seller a { width: 89px; } /* body.wine-details ul.details li.featured a { width: 72px; background-position: 100% 0; } */ body.wine-details ul.details li.featured { display: none; } /* RATING */ body.wine-details ul.rating { margin-right: 125px; float: right; } /* DESCRIPTION & PHOTO */ body.wine-details h2.limited, body.wine-details h2.not-available { margin: 0 0 10px 0; width: 310px; float: left; clear: left; color: #f0037f; font-size: 18px; font-weight: bold; } body.wine-details p.description { width: 310px; float: left; clear: left; } body.wine-details #wine-photo { width: 125px; position: absolute; top: 0; right: 1px; z-index: 10; text-align: right; } /* ACTIONS */ body.wine-details div.actions { margin-bottom: 20px; width: 305px; float: left; clear: left; position: relative; } body.wine-details div.actions button { height: 34px; display: none; } body.wine-details div.actions button.add-to-cart { width: 178px; } body.wine-details div.actions button.in-cart { width: 148px; background-position: 0 -40px; } body.wine-details div.actions button.not-available { width: 120px; background-position: 0 -120px; } body.wine-details div.actions button.processing { width: 181px; } /* WINEKEY */ #winekey { margin: -47px 0 20px 0; padding: 19px 15px 15px 15px; width: 336px; border: 1px solid #CCC; float: right; -moz-border-radius: 12px; -webkit-border-radius: 12px; } #winekey h2 { margin: 0 0 17px 0; padding: 0 0 4px 0; border-bottom: 1px solid #CCC; height: 30px; background: url(../images/titles/winekey_title_matrix.png) no-repeat; text-indent: -9999px; } #winekey dl { margin: 0; padding: 0; width: 235px; } #winekey dl dt { margin: 0; padding: 0; height: 9px; background: url(../images/titles/winekey_title_matrix.png) no-repeat; text-indent: -9999px; } #winekey dl dd { font-size: 12px; } /* COLOR, BODY, FLAVOR */ #winekey dl.c-b-f dt { margin: 0 0 10px 0; background-position: 0 -40px; } #winekey dl.c-b-f dd { margin: 0 0 10px 10px; height: 38px; float: left; position: relative; left: -10px; background: url(/images/icons/winekey_icon_matrix.png) no-repeat; text-indent: -9999px; } /* COLOR */ #winekey dl.c-b-f dd.color { width: 30px; } #winekey dl.c-b-f dd.rose { background-position: -40px 0; } #winekey dl.c-b-f dd.white { background-position: -80px 0; } /* BODY */ #winekey dl.c-b-f dd.body { width: 38px; } #winekey dl.c-b-f dd.full { background-position: -120px 0; } #winekey dl.c-b-f dd.medium { background-position: -160px 0; } #winekey dl.c-b-f dd.light { background-position: -200px 0; } /* FLAVOR */ #winekey dl.c-b-f dd.apricot { width: 37px; background-position: -240px 0; } #winekey dl.c-b-f dd.astringent { width: 37px; background-position: -280px 0; } #winekey dl.c-b-f dd.blackcherry { width: 36px; background-position: -320px 0; } #winekey dl.c-b-f dd.blackberry { width: 30px; background-position: -360px 0; } #winekey dl.c-b-f dd.butter { width: 37px; background-position: -400px 0; } #winekey dl.c-b-f dd.chocolate { width: 24px; background-position: -440px 0; } #winekey dl.c-b-f dd.floral { width: 36px; background-position: -480px 0; } #winekey dl.c-b-f dd.grapefruit { width: 37px; background-position: -520px 0; } #winekey dl.c-b-f dd.greenapple { width: 33px; background-position: -560px 0; } #winekey dl.c-b-f dd.honey { width: 36px; background-position: -600px 0; } #winekey dl.c-b-f dd.lemonlime { width: 33px; background-position: -640px 0; } #winekey dl.c-b-f dd.pear { width: 25px; background-position: -680px 0; } #winekey dl.c-b-f dd.redapple { width: 32px; background-position: -720px 0; } #winekey dl.c-b-f dd.redcherry { width: 37px; background-position: -760px 0; } #winekey dl.c-b-f dd.spice { width: 37px; background-position: -800px 0; } #winekey dl.c-b-f dd.strawberry { width: 28px; background-position: -840px 0; } #winekey dl.c-b-f dd.vanilla { width: 25px; background-position: -880px 0; } #winekey dl.c-b-f dd.vegetal { width: 24px; background-position: -920px 0; } /* HOVER STATES */ #winekey dl.c-b-f dd div { height: 92px; display: none; position: absolute; top: -18px; z-index: 10; background: url(../images/icons/winekey_icon_hovers.png); } #winekey dl.c-b-f dd:hover div { display: block; } /* COLOR */ #winekey dl.c-b-f dd.color div { width: 150px; } #winekey dl.c-b-f dd.color.red div { left: -18px; } #winekey dl.c-b-f dd.color.rose div { left: -58px; background-position: 0 -100px; } #winekey dl.c-b-f dd.color.white div { left: -98px; background-position: 0 -200px; } /* BODY */ #winekey dl.c-b-f dd.body div { width: 170px; } #winekey dl.c-b-f dd.body.full div { left: -18px; background-position: -150px 0; } #winekey dl.c-b-f dd.body.medium div { left: -64px; background-position: -150px -100px; } #winekey dl.c-b-f dd.body.light div { left: -110px; background-position: -150px -200px; } /* FLAVOR */ #winekey dl.c-b-f dd.flavor:hover div { display: block; left: -18px; } #winekey dl.c-b-f dd.apricot div { width: 73px; background-position: -320px 0; } #winekey dl.c-b-f dd.astringent div { width: 75px; background-position: -400px 0; } #winekey dl.c-b-f dd.blackcherry div { width: 84px; background-position: -480px 0; left: -24px !important; } #winekey dl.c-b-f dd.blackberry div { width: 76px; background-position: -570px 0; left: -23px !important; } #winekey dl.c-b-f dd.butter div { width: 73px; background-position: -650px 0; } #winekey dl.c-b-f dd.chocolate div { width: 72px; background-position: -730px 0; left: -24px !important; } #winekey dl.c-b-f dd.floral div { width: 72px; background-position: -320px -100px; } #winekey dl.c-b-f dd.grapefruit div { width: 74px; background-position: -400px -100px; left: -19px !important; } #winekey dl.c-b-f dd.greenapple div { width: 78px; background-position: -480px -100px; left: -23px !important; } #winekey dl.c-b-f dd.honey div { width: 72px; background-position: -570px -100px; } #winekey dl.c-b-f dd.lemonlime div { width: 74px; background-position: -650px -100px; left: -21px !important; } #winekey dl.c-b-f dd.pear div { width: 61px; background-position: -730px -100px; } #winekey dl.c-b-f dd.redapple div { width: 68px; background-position: -320px -200px; } #winekey dl.c-b-f dd.redcherry div { width: 74px; background-position: -400px -200px; } #winekey dl.c-b-f dd.spice div { width: 73px; background-position: -480px -200px; } #winekey dl.c-b-f dd.strawberry div { width: 78px; background-position: -570px -200px; left: -25px !important; } #winekey dl.c-b-f dd.vanilla div { width: 61px; background-position: -650px -200px; } #winekey dl.c-b-f dd.vegetal div { width: 60px; background-position: -730px -200px; } /* PAIRINGS & OCCASIONS */ #winekey dl.pairings { margin-top: 9px; } #winekey dl.pairings dt { margin-bottom: 3px; background-position: 0 -50px; } #winekey dl.occasions { margin-top: 14px; } #winekey dl.occasions dt { margin-bottom: 3px; background-position: 0 -60px; } /* UNSELECTED */ #winekey dl.color dd.red a { background-position: 0 0; } #winekey dl.color dd.rose a { background-position: -40px 0; } #winekey dl.color dd.white a { background-position: -80px 0; } #winekey dl.body dd.full a { background-position: 0 -60px; } #winekey dl.body dd.medium a { background-position: -40px -60px; } #winekey dl.body dd.light a { background-position: -80px -60px; } /* TASTING NOTES */ #tasting-notes { padding-left: 5px; clear: both; display: none; } #tasting-notes h2 { margin: 0; padding: 0; height: 16px; background: url(../images/titles/content_subtitle_matrix.png) 0 -40px no-repeat; text-indent: -9999px; } #tasting-notes p { margin-bottom: .5em; } body.authed #tasting-notes { display: block; } /* NOTES CONTROL */ div.notes form { display: none; } div.notes input { margin-right: 5px; width: 420px; border: 1px solid #CCC; padding: 6px; font-size: 16px; } div.notes button { width: 83px; height: 33px; } div.notes button.note-it { background-position: -590px 0; margin-right: 5px; } div.notes button.processing { display: none !important; top: -9999px; background-position: 0 -80px; margin-right: 5px; } div.notes form span { display: none; font-size: 12px; vertical-align: middle; } div.notes blockquote { padding-top: 5px; border-top: 1px solid #CCC; } div.notes blockquote p { font-size: 16px; } div.notes blockquote span { font-size: 11px; } div.notes blockquote span a { margin-right: 15px; } /* PROCESSING */ form.processing button.note-it { display: none; } form.processing button.processing { display: inline !important; position: static; } /* NEW/EDIT NOTE */ div.notes.new form, div.notes.edit form { display: block; } div.notes.new blockquote, div.notes.edit blockquote { display: none; } div.notes.edit span { display: inline; } div.notes.new span { display: none; } /* SEND TO A FRIEND */ #send-to-friend form, #send-to-friend form div.buttons { margin-bottom: 0; } #send-to-friend.bad-from-email div#bad-from-email, #send-to-friend.bad-to-email div#bad-to-email, #send-to-friend.bad-name div#no-name { display: block; } /* SIMILAR WINES */ /* #similar-wines h2 { margin: 0 0 15px 0; padding: 12px 0 6px 5px; font-size: 20px; display: block; text-transform: none; color: #4f504b; border-bottom: 1px solid #CCC; } a.more-wines { margin: 10px 0 0 0; width: 177px; height: 29px; display: block; float: right; background: url(../images/buttons/button_matrix.png) -420px -120px; text-indent: -9999px; } */ /* SIMILAR WINE LIST */ /* ul.wine-list.similar { border-top: 1px solid #CCC; border-bottom: none; } ul.wine-list.similar > li { margin-left: 15px; padding-left: 60px; width: 160px; border-top: none; border-bottom: 1px solid #CCC; float: left; } ul.wine-list.similar li:first-child { margin-left: 0; } ul.wine-list.similar li h4 { width: auto; font-size: 21px; font-weight: bold; line-height: 1; } ul.wine-list.similar li img { left: 0; } */ /* DETAILS */ /* ul.wine-list.similar li ul.details { width: 160px; left: 60px; } ul.wine-list.similar li ul.details li { float: none; } ul.wine-list.similar li ul.details li.price { margin-top: 72px; font-size: 32px; } ul.wine-list.similar li ul.details li.price sup { font-size: 18px; } ul.wine-list.similar li ul.details li.price sup span { display: none; } */ /* ICONS */ /* ul.wine-list.similar li ul.icons { width: 160px; height: 30px; overflow: hidden; } */