web/public/assets/mall/css/style.css

1466 lines
33 KiB
CSS

@charset "utf-8";
body {
font: normal 11pt Arial, Verdana, Times, serif;
margin: 0;
padding: 0;
text-align: center;
color: #000000;
scrollbar-base-color: #6d0808;
scrollbar-arrow-color: #f6cf55;
scrollbar-3dlight-color: #390000;
scrollbar-darkshadow-color: #390000;
scrollbar-face-color: #6d0808;
scrollbar-highlight-color: #ac2727;
scrollbar-shadow-color: #540101;
scrollbar-track-color: #e5c688;
}
h1, h2, h3, h4, h5, h6, p, div, ul, li, a, dt, ol, strong, em, form, input, textarea, table, th, td, tr, pre, dl {
margin:0;
padding:0;
}
img { border:0 none; }
#container {
position:absolute;
top:0;
left:0;
width: 740px;
max-width: 740px;
height: 550px;
max-height: 550px;
background: #fff2df url(../img/container.jpg) no-repeat;
text-align: left;
}
.twoColFixLtHdr #header {
position: relative;
height: 75px;
}
.twoColFixLtHdr #header h1 {
margin: 0;
padding: 10px 0;
}
#sidebar1 {
float: left;
width: 145px;
height: 276px;
padding: 13px 1px 11px 19px;
}
#search {
width: 137px;
height: 22px;
margin-bottom: 10px;
}
#search .type {
display:block;
float:left;
width: 108px;
height: 20px;
line-height: 20px;
border: 1px solid #c4ad89;
background-color: #fefae9;
color: #b6ac94;
font-size: 11px;
padding-left:2px;
}
#search .send {
display:block;
float:left;
width: 24px;
height: 22px;
border: 0 none;
background: transparent url(../img/searchSend.png) no-repeat;
}
#mainContent {
float: left;
margin: 13px 0 0 0;
display: inline;
width: 575px;
height: 417px;
font-size:13px;
overflow: hidden;
}
#mainContent h1 {
width: 524px;
height: 26px;
line-height: 26px;
font-size: 12px;
color: #fef5e7;
padding-left: 20px;
background:transparent url(../img/mainContentHeader.png) no-repeat;
overflow: hidden;
}
#mainContent .dynContent {
width: 557px;
height: 378px;
overflow-y: auto;
padding-left: 10px;
background:transparent url(../img/dynContent.png) repeat-y;
}
#mainContent .dynContentSmall {
width: 544px;
height: 378px;
overflow: hidden;
padding-left: 2px;
background:transparent url(../img/dynContent.png) repeat-y;
}
#mainContent .endContent {
width: 547px;
height: 13px;
line-height: 13px;
overflow: hidden;
background:transparent url(../img/endContent.png) no-repeat;
}
#wideMainContent {
width:572px;
height:430px;
position:relative;
margin:0;
font-size:13px;
float:left;
overflow:hidden;
}
#wideMainContent .endContent {
display:none;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
#header #specialDays {
left:240px;
top:30px;
position:absolute;
}
#header .heading {
/*text-transform: uppercase;*/
font-weight: bold;
font-family: Tahoma, Verdana, sans-serif;
color: #52100e;
padding-left: 15px;
}
.boxSigns {
position: absolute;
width: 223px;
height: 30px;
left: 356px;
font-size: 11px;
font-weight:bold;
padding-top: 35px;
}
.boxCoins {
position:absolute;
width: 233px;
height: 30px;
left: 334px;
font-size: 13px;
font-weight:bold;
padding-top: 5px;
}
#header .values {
line-height: 12px;
padding:2px 0 0 30px;
max-width:172px;
color: #8e5e02;
font-size: 12px;
font-weight:normal;
}
#header .coinsValue {color:#6e0404; font-size:13px;font-weight:bold; padding-left:3px;}
#header .marksValue {color:#6e0404; font-size:12px;font-weight:bold; padding-left:3px;}
#header .marksDesc, .coinsDesc {font-size:11px; font-weight:bold;}
#header a.purchaseButton, #header a.purchaseButtonHappyHour{
background: transparent url(../img/purchaseButton.png) no-repeat;
width: 130px;
height: 52px;
line-height: 16px;
margin-top: -14px;
margin-left: 237px;
display: block;
text-decoration: none;
vertical-align: center;
color: #fce6a4;
text-align:center;
vertical-align: bottom;
padding-top: 8px;
padding-left: 10px;
padding-right: 10px;
}
#header a.purchaseButtonHappyHour{background: transparent url(../img/purchaseButtonHappyHour.png) no-repeat;}
#header a.purchaseButton:hover {background:transparent url(../img/purchaseButtonHover.png) no-repeat;}
#header a.purchaseButtonHappyHour:hover {background:transparent url(../img/purchaseButtonHappyHourHover.png) no-repeat;}
#breadcrumb {
/*width: 720px;*/
height: 24px;
line-height: 24px;
font-size: 12px;
list-style: none;
padding-left: 20px;
overflow:hidden;
}
#breadcrumb li {float:left; line-height:24px; color:#996600; padding-right: 7px;}
#breadcrumb .last {font-weight:bold; color: #730709;}
#breadcrumb li a {text-decoration:none; color:#996600;}
#discountLong {
display: inline;
float:left;
height: 16px;
background-color:#000;
border:1px solid #fff;
color:#fff;
padding: 3px 9px 3px 9px;
margin-right: 0px;
font-size:12px;
font-weight:bold;
z-index: 8;
line-height: 17px;
}
#arrowRight{
position: absolute;
width: 0;
height: 0;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid #000;
margin-left: -2px;
margin-top: 6px;
z-index: 11;
}
#arrowBorderRight{
position: absolute;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
border-left: 7px solid #fff;
margin-left: 0px;
margin-top: 5px;
z-index: 10;
}
#arrowUp{
position: absolute;
width: 0;
height: 0;
border-right: 12px solid transparent;
border-bottom: 12px solid #000;
border-left: 12px solid transparent;
margin-top: -11px;
margin-left: -67px;
z-index: 11;
}
#arrowBorderUp{
position: absolute;
width: 0;
height: 0;
border-right: 13px solid transparent;
border-bottom: 13px solid #fff;
border-left: 13px solid transparent;
margin-top: -13px;
margin-left: -68px;
z-index: 10;
}
#arrowDiv{
float: right;
z-index: 11;
margin-right: 9px;
width: 1px;
height: 1px;
}
#breadcrumbInfoText
{
display: none;
position: relative;
float: right;
margin-right: 5px;
}
#mainMenu {
list-style: none;
width: 136px;
font-size: 11px;
font-family:Arial, Tahoma, sans-serif
}
#mainMenu li {
line-height: 23px;
padding-bottom: 5px;
}
#mainMenu li a {
display: block;
width: 115px;
line-height: 19px;
padding: 2px 2px 2px 19px;
text-decoration: none;
color: #fef5e7;
background: transparent url(../img/mainMenuButton.png) no-repeat;
}
#mainMenu li a:hover {
background: transparent url(../img/mainMenuButtonHover.png) no-repeat;
color: #fff;
}
.item {
background: transparent url(../img/itemBackground.png) no-repeat;
width: 522px;
height: 90px;
color: #222;
margin-top: 10px;
}
.itemsurprise {
background: transparent url(../img/itemBackgroundSurprise.png) no-repeat;
width: 522px;
height: 90px;
color: #222;
margin-top: 10px;
}
.hint {
background: transparent url(../img/hintBackground.png) no-repeat;
width: 522px;
height: 129px;
color: #222;
margin-top: 10px;
margin-right: 5px;
}
.hint_textonly {
width: 522px;
height: 100px;
color: #222;
margin-top: 10px;
}
#credits {
padding: 10px;
}
#credits table {
border-collapse: collapse;
}
#credits table td {
vertical-align: top;
padding: 10px;
}
.creditswhat {
color: #6C0404;
font-size: 12px;
font-weight: bold;
}
.creditswho {
font-size: 12px;
}
.thanks {
color: #6C0404;
font-size: 12px;
font-weight: bold;
}
#confirmBox {background: transparent url(../img/itemBackgroundSurprise.png) no-repeat;}
.line {
font-size:1px;
display:inline-block;
width:281px;
height:1px;
overflow:hidden;
line-height:1px;
background-color:#eebe67;
padding-left: 10px;
}
.itemDesc {float: left; display: inline; width:382px; height:78px; margin:10px 0 0 10px;}
.confirmDesc {width: 500px;}
.messageDesc {width: 500px; height: 100px;}
.thumbnailBgSmall {
background:transparent url(../img/thumbnailBgSmall.png) no-repeat;
width: 69px;
height: 69px;
float: left;
padding: 3px;
position: relative;
}
.itemDesc img {display:inline; border: 0 none;}
.itemDesc p {
float:left;
width:293px;
color:#222;
font-weight:normal;
font-size:12px;
overflow:hidden;
padding-left: 10px;
overflow-y:auto;
max-height:76px;
}
.confirmDesc p, messageDesc p {width: 393px}
.messageDesc p {width: 400px; height: 95px; padding: 20px 0 0 0;}
.hint_textonly .messageDesc { height:auto; }
.hint_textonly .messageDesc p { width:500px; padding-top:0; }
.itemDesc p span {font-size:12px;font-weight:bold;color:#6c0404;}
.purchaseOptionsWrapper {
float: left;
width: 129px;
height: 75px;
margin-top: 10px;
}
.itemDesc p .errorTitle, .itemDesc p .confirmTitle {font-size: 14px;}
.itemDesc p .confirmTitle {color: #579409;}
.itemDesc p .confirmLink {
background: transparent url(../img/confirmButton.png) no-repeat;
display: block;
font-weight: 700;
line-height: 23px;
padding-left: 32px;
margin-top: 12px;
color: #fef5e7;
width: 142px;
height: 23px;
text-decoration: none;
}
.itemDesc p .confirmLink:hover {
color: #fff;
background: transparent url(../img/confirmButtonHover.png) no-repeat;
}
.itemDesc a {
text-decoration: none;
}
a.purchaseInfo, a.addToCard , a.useDragonMark{
width:119px;
height:20px;
display:block;
float:left;
margin-top:7px;
color:white;
font-size:14px;
font-weight:bold;
text-align:center;
text-decoration:none;
padding-top:5px;
}
a.purchaseInfo {background: transparent url(../img/purchaseInfo.png) no-repeat;}
a.addToCard {background: transparent url(../img/addToCard.png) no-repeat;display:inline;margin-left:11px;}
a.useDragonMark {background: transparent url(../img/useDragonMark.png) no-repeat;display:inline;margin-left:11px;}
a.purchaseInfo:hover {background: transparent url(../img/purchaseInfoHover.png) no-repeat;}
a.addToCard:hover {background: transparent url(../img/addToCardHover.png) no-repeat;}
a.useDragonMark:hover {background: transparent url(../img/useDragonMarkHover.png) no-repeat;}
a.addToCardBlank {
width:54px;
height:25px;
float:left;
margin-top:7px;
background:transparent url(../img/addToCardBlank.png) no-repeat;
display:inline;
margin-left:11px;
cursor:wait;
}
a.addToCardBlank:hover {
background:transparent url(../img/addToCardBlank.png) no-repeat;
cursor:wait;
}
a.useDragonMarkBlank {
width:54px;
height:25px;
float:left;
margin-top:7px;
background:transparent url(../img/useDragonMarkBlank.png) no-repeat;
display:inline;
margin-left:11px;
cursor:wait;
}
a.useDragonMarkBlank:hover {
background:transparent url(../img/useDragonMarkBlank.png) no-repeat;
cursor:wait;
}
.itemPrice {
width: 115px;
height: 33px;
line-height: 33px;
padding: 1px 1px 1px 3px;
background: transparent url(../img/itemPrice.png) no-repeat;
}
.oldPrice {font: 10px Arial,Verdana,serif;text-decoration: line-through;}
#oldPriceAmount {text-decoration: line-through;}
.price {font: bold 14px Arial,Verdana,serif;color: #8d0000;}
.priceValue {font-size:10px; color:#222;width:135px;}
.ItemColLeft {
width: 163px;
height: 306px;
max-height: 306px;
float:left;
margin-top: 10px;
}
.thumbnailBig {
width: 132px;
height:132px;
background: transparent url(../img/thumbnailBig.png) no-repeat;
padding: 11px;
}
.thumbnailBig img {width:132px;height:132px;border:0 none;}
.itemDescExt {
float:left;
width: 360px;
overflow: hidden;
margin-top: 10px;
}
.itemDescExt a {
color:black;
}
.itemDescExt h2 {
width: 349px;
height: 30px;
line-height: 30px;
background: transparent url(../img/itemDescExt.png) no-repeat;
font-size:12px;
font-weight: bold;
color: #6c0404;
padding-left: 11px;
}
.itemDesc p span.discountShort, .itemDescExt h2 span.discountShort {
color:#e00;
font-weight:bold;
float:right;
padding:0 20px 0 0;
}
.itemDescExt h3, .itemDescExt .chooseItemDescExt {
background: transparent url(../itemDescExt.png) no-repeat;
height: 33px;
line-height: 33px;
font-size:16px;
font-weight: bold;
color: #6c0404;
padding-left: 11px;
margin-top: 10px;
width: 349px;
}
.itemDescExt .chooseItemDescExt {
background: transparent url(../img/itemDescExtBig.png) no-repeat;
height: 60px;
}
.itemDescExt .chooseItemDescExt .priceSelect {float:left;}
.itemDescExt .chooseItemDescExt .priceSelect select, .buy .priceSelect select {
background-color:#EFE5D1;
font-size:10pt;
margin-top:5px;
width:140px;
}
* html .itemDescExt .chooseItemDescExt .priceSelect select {margin-top:10px;}
.itemDescExt h3 span {float: left;}
.itemDescExt h3 a, .itemDescExt .chooseItemDescExt a, .buy a {
display:inline;
width: 114px;
height:25px;
line-height: 25px;
margin: 4px 5px 0 0;
padding-left: 37px;
background: transparent url(../img/itemDescExtBuy.png) no-repeat;
color:#fff;
font-size: 12px;
font-weight: bold;
text-decoration: none;
float: right;
}
.itemDescExt .chooseItemDescExt a {margin-top:30px;}
.packageDesc h3 a {margin-top:5px;}
.itemDescExt h3 a.assignMarks, .itemDescExt .chooseItemDescExt a.assignMarks, .buy a.assignMarks {background: transparent url(../img/itemDescExtAssignMarks.png) no-repeat;}
.itemDescExt h3 a.blank {
display:inline;
width:114px;
height:25px;
line-height:25px;
margin:4px 5px 0 0;
padding-left:37px;
background:transparent url(../img/itemDescExtBuyBlank.png) no-repeat;
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
float:right;
cursor:wait;
margin-top:5px;
}
.itemDescExt h3 a.blank:hover {
background:transparent url(../img/itemDescExtBuyBlank.png) no-repeat;
cursor:wait;
}
.itemDescExt .chooseItemDescExt a.blank, .buy a.blank {
display:inline;
width:114px;
height:25px;
line-height:25px;
margin:4px 5px 0 0;
padding-left:37px;
background:transparent url(../img/itemDescExtBuyBlank.png) no-repeat;
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
float:right;
cursor:wait;
margin-top:30px;
}
.itemDescExt .chooseItemDescExt a.blank:hover, .buy a.blank:hover {
background:transparent url(../img/itemDescExtBuyBlank.png) no-repeat;
cursor:wait;
}
.itemDescExt h3 a.assignMarksBlank {
display:inline;
width:114px;
height:25px;
line-height:25px;
margin:4px 5px 0 0;
padding-left:37px;
background:transparent url(../img/itemDescExtAssignMarksBlank.png) no-repeat;
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
float:right;
cursor:wait;
margin-top:5px;
}
.itemDescExt h3 a.assignMarksBlank:hover {
background:transparent url(../img/itemDescExtAssignMarksBlank.png) no-repeat;
cursor:wait;
}
.itemDescExt .chooseItemDescExt a.assignMarksBlank {
display:inline;
width:114px;
height:25px;
line-height:25px;
margin:4px 5px 0 0;
padding-left:37px;
background:transparent url(../img/itemDescExtAssignMarksBlank.png) no-repeat;
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
float:right;
cursor:wait;
margin-top:30px;
}
.itemDescExt .chooseItemDescExt a.assignMarksBlank:hover {
background:transparent url(../img/itemDescExtAssignMarksBlank.png) no-repeat;
cursor:wait;
}
.shoppingCardContent {
width: 349px;
padding: 7px 0 0 11px;
line-height: 13px;
background: transparent url(../img/shoppingCardContent.png) repeat-y;
color: #222;
font-size: 12px;
}
.mainInfo {
width:344px;
height:auto;
min-height: 152px !important;
height:auto;
padding:5px 5px 0 11px;
background:transparent url(../img/mainInfo.png) repeat-y;
color: #222;
font-size: 12px;
}
.shoppingCardEnd {
width:360px;
height: 10px;
line-height: 10px;
background: transparent url(../img/shoppingCardEnd.png) no-repeat;
}
.mainInfo ul {
width: 350px;
list-style: none;
font-size: 11px;
font-weight: bold;
padding-top: 10px;
}
.mainInfo ul li {
line-height:14px;
padding-left: 15px;
background:transparent url(../img/mainInfoBullet.png) no-repeat left;
}
.itemNote {margin-top:7px;}
.endItemDesc {
background: transparent url(../img/endItemDesc.png) no-repeat;
width: 360px;
height: 11px;
line-height: 11px;
}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.clearfloat {font-size:1px;clear:both; height:0;}
/* captcha */
.captcha {
width:522px;
}
.captcha h2 {
margin:10px 0;
}
.captcha h3 {
color:red;
margin:14px 0 2px
}
.captcha form {
text-align:center;
}
.captcha input {
margin:10px auto;
display:block;
padding:0 10px;
}
.captcha #answer {
height:20px;
margin:0;
padding:0;
display:inline;
width:194px;
}
#captchaContainer {
margin:10px 0 0 0;
}
#captchaImageContainer {
position:relative;
width:255px !important;
margin:20px auto;
}
#captchaImageContainer img {
border:1px solid #B28A45;
margin:0;
color:black;
}
#reloadCaptcha {
position:absolute;
right:0;
top:0;
padding:0 1px 2px 2px;
background-color:#eee;
cursor:pointer;
border-radius:0 0 0 6px;
-moz-border-radius:0 0 0 6px;
-webkit-border-radius:0 0 0 6px;
}
.userdataDiv
{
float: right;
font-size: 14px;
margin-top: 2px;
height: 22px;
width: 22px;
}
#container a.userdataIcon
{
display: block;
float: right;
background: transparent url(../img/userdataIcon.png) no-repeat;
width: 22px;
height: 22px;
margin-top: -1px;
margin-right: 5px;
}
#container a.userdataIcon:hover
{
background: transparent url(../img/userdataIconHover.png) no-repeat;
}
#container a.userdataInfoIcon
{
display: block;
float: right;
background: transparent url(../img/userdataInfoIcon.png) no-repeat;
width: 22px;
height: 22px;
margin-top: -1px;
margin-right: 5px;
}
#container a.userdataInfoIcon:hover
{
background: transparent url(../img/userdataInfoIconHover.png) no-repeat;
}
/* end captcha*/
/* Special highlighting for parts of loca keys */
em.highlighted {
font-weight:bold !important;
color:red !important;
font-style:normal !important;
}
.helpSmallHeading {
display:block;
float:right;
width:20px;
height:20px;
margin:2px 10px 0 0;
background:url(../img/helpSmallIcon.png) no-repeat;
}
.helpSmallTopic {
display:inline-block;
width:20px;
height:20px;
margin:0 0 0 10px;
background:url(../img/helpSmallIcon.png) no-repeat;
vertical-align:bottom;
}
.helpSmallIcon {
vertical-align: middle;
position: absolute;
width: 15px;
}
.helpSmallIcon img {
width: 15px;
height: 15px;
}
.groupItem {
width:525px;
margin:10px 0 15px;
}
.groupItem h2 {
color:white;
cursor:pointer;
font-size:14px;
height:19px;
padding:7px 0 0 30px;
}
.groupItem.opened {
background:url(../img/groupItemOpened.png) no-repeat;
}
.groupItem.closed {
background:url(../img/groupItemClosed.png) no-repeat;
}
.groupItem a {
text-decoration:none;
color:#7B1300;
}
.groupItem ul {
list-style-type:none;
background:url(../img/dynContent.png) repeat-y transparent;
}
.groupItem.opened ul {
display:block;
}
.groupItem.closed ul {
display:none;
}
.groupItem ul li {
padding:10px;
}
.groupItem ul li ul {
list-style-type:disc;
background:none;
margin-left:30px;
}
.groupItem ul li ul li {
padding:0 0 4px 0;
}
.groupItem ul li h3 {
margin:7px 0 5px;
color:#7b1300;
}
.groupItem ul li p {
margin:0 0 4px;
}
.groupItem .groupItemEnd {
height:13px;
background:transparent url(../img/endContent.png) no-repeat;
}
/* item detail 2.0 */
body #fancybox-outer {
padding: 5px 5px 0;
-webkit-border-radius: 10px;
border-radius: 10px;
}
#fancybox-outer.fancybox-outer-wheel {
padding: 0px 0px 0;
-webkit-border-radius: 0px;
border-radius: 0px;
}
#fancybox-content .dynContent {
height: auto;
padding: 0 8px;
}
/* content styles */
#fancybox-content h1 {
width: 520px;
height: 26px;
line-height: 26px;
font-size: 12px;
color: #fef5e7;
padding-left: 20px;
margin-bottom: 10px;
background:transparent url(../img/fancyboxContentHeader.png) no-repeat;
overflow: hidden;
}
#fancybox-content .dynContent h2 {
font-size: 12px;
font-weight: bold;
margin-bottom: 0.8em;
padding-bottom: 0.4em;
color: #6C0404;
border-bottom: 1px solid #e29000;
overflow: hidden;
white-space: nowrap;
}
#fancybox-content .dynContent p {
color: #222;
font-size: 12px;
}
/* boxes */
.box {
background: #fffef7;
border: 1px solid #fcf5db;
-webkit-border-radius: 10px;
border-radius: 10px;
padding: 10px;
margin-bottom: 10px;
overflow: hidden;
}
.boxLeft {
float: left;
margin-right: 10px;
}
.boxRight {
float: right;
margin-left: 10px;
}
.priceSelect {
float: left;
}
.box li a {
font-size: 12px;
text-decoration: underline;
color: #6C0404;
}
.box li {
font-size: 12px;
}
.detail .visual {
background-image: none;
width: 119px;
height: 119px;
position: relative;
}
.visual img {
width: 119px;
height: 119px;
}
.invisible {
display: none;
}
/* description and scrollpane */
.desc {
height: 119px;
}
.descOnlyItem {
height: 165px;
}
.scrollpane { height: 90px; }
.scrollpaneOnlyItem { height: 140px; }
.scrollpane .jspDrag { background-color: #36250b; }
.scrollpane .jspTrack {
background-color: #5a4421;
border-left: 1px solid #222;
border-right: 1px solid #222;
margin: 0 1px;
}
.scrollpane .jspVerticalBar {
width: 20px;
background: none;
}
.scrollpane .jspVerticalBar .jspArrow {
height: 20px;
width: 20px;
background-image: url(../img/scrollPaneArrow.png);
background-repeat: no-repeat;
}
.scrollpane .jspVerticalBar .jspArrowUp { background-position: 0 0; }
.scrollpane .jspVerticalBar .jspArrowDown { background-position: 0 -60px; }
.scrollpane .jspVerticalBar .jspArrowUp:hover { background-position: 0 -20px; }
.scrollpane .jspVerticalBar .jspArrowDown:hover { background-position: 0 -40px; }
/* buy */
.buy {
border: 1px solid #eda82a;
width: 150px;
height: 115px;
overflow: visible;
padding-left: 20px;
padding-top: 20px;
}
.onlyItem {
width: 340px;
height: 80px;
}
.buy a {
margin-top: 5px !important;
margin-bottom: 3px !important;
}
.sprice, .sprice-discount {
color: #6C0404;
}
.sprice, .sprice-discount {
font-weight: bold;
line-height: 33px;
font-size: 16px;
font-weight: bold;
}
.buyInfo {
overflow: hidden;
font-size: 10px;
width: 100%;
height: 2.5em;
}
/* sold out - countdown */
.detailBadge {
position: relative;
height: 0;
line-height: 0;
}
.detailBadgeInner {
position: absolute;
top: -10px;
right: -20px;
}
.soldout, .countdown {
float:left;
width:110px;
border:none;
color:#FEF6AA;
font-size:13px;
text-align: center;
width: 110px;
margin:0 15px 0 0;
padding:0 0 2px 0px;
height:25px;
line-height: 31px;
background:url('../img/soldout.png') 0px 1px no-repeat;
}
.countdown {
right: -5px;
text-align: left;
font-size:18px;
margin:0 -9px 0 0;
padding:0 0 2px 12px;
background:url('../img/countdown.png') 0px 1px no-repeat;
}
.timer {
float:left;
width:24px;
height:24px;
margin:1px 0 0;
background:url('../img/timer.png') top left no-repeat;
}
/* hints */
#fancybox-content .hint {
margin: 15px 0 10px 0;
padding: 0 8px;
clear: both;
color:#222;
font-size:12px;
overflow:hidden;
width: auto;
overflow-y:auto;
max-height:120px;
}
.hintTitle {
font-weight:bold;
color:#6c0404;
}
.hintVisual {
height: 120px;
float: left;
margin-right: 8px;
}
/* variants */
.variants {
height: 125px;
}
.variants .ui-selected {
background-image: url(../img/variantsSelected.png);
}
.variants .ui-selected, .variants .ui-selected a {
color: #bb6400;
}
#fancybox-content .thumbnailBgSmall {
height: 79px;
width: 63px;
margin-right: 4px;
overflow: hidden;
}
li.thumbnailBgSmall, li.thumbnailBgSmall * {
text-align: center;
}
li.thumbnailBgSmall img {
display: inline-block;
}
li.thumbnailBgSmall img.bigPreloaded {
display:none;
}
/* carousel for variants */
.carousel {
position: relative;
padding-left: 11px;
}
.carouselHolder .prev, .carouselHolder .next {
display: none;
}
.carousel .prev, .carousel .next {
display: block;
position: absolute;
top: 0;
left: -10px;
border: none;
border-style: none;
background: transparent url(../img/carouselArrows.png);
width: 20px;
height: 69px;
z-index: 99;
cursor: pointer;
}
.carousel .next {
left: auto;
right: -10px;
background-position: -80px 0;
}
.carousel .prev:hover { background-position: -20px 0; }
.carousel .next:hover { background-position: -60px 0; }
.carousel .prev.disabled { background-position: -40px 0; }
.carousel .next.disabled { background-position: -100px 0; }
.carousel .jCarouselLite {
float: left;
position: relative;
visibility: hidden;
left: -5000px;
}
.clear { clear: both; }
/* suggestions */
.suggestions {
width: 100%;
}
/* main landing page */
.landing {
position:relative;
}
#wideMainContent .landing {
position:relative;
background:url(../img/wideMainContent.jpg) no-repeat;
width:572px;
height:430px;
display:block;
padding-left:3px;
padding-top:7px;
}
#wideMainContent .landing h1 {
float:left;
display:block;
background:url(../img/wideMainContentHeader.png) no-repeat transparent;
width:385px;
height:24px;
color:#fff;
font-size:14px;
font-weight:bold;
margin-top:14px;
margin-bottom:4px;
margin-left:5px;
padding-left:8px;
line-height:23px;
}
.landing a.buyDR, .landing a.buyDR:hover {
display:block;
position:absolute;
top:330px;
left:409px;
width:138px;
height:76px;
padding:10px;
color:#ffffff;
font-weight:bold;
text-decoration:none;
}
.landing a.buyDR {
background:url(../img/buyDR.jpg) no-repeat;
}
.landing a.buyDR:hover {
background:url(../img/buyDRHover.jpg) no-repeat;
}
.landing .promotedItem {
float:left;
position:relative;
display:block;
width:180px;
height:82px;
background:url(../img/promotedItem.png) no-repeat transparent;
margin-top:3px;
}
.landing .promotedItem h4 {
position:absolute;
top:8px;
left:80px;
display:block;
width:104px;
height:25px;
border:0 none;
color:#7B1300;
font-size:11px;
font-weight:bold;
line-height:11px;
letter-spacing:-0.05em;
}
.landing .promotedItem .promotedItemImg img {
position:absolute;
top:11px;
left:6px;
border: 0 none;
display:block;
width:63px;
height:63px;
}
.landing .promotedItem div, .landing .promotedItem p {
width:96px;
}
.landing .promotedItem div.promotedItemBtns {
position:absolute;
bottom:10px;
right:8px;
width:96px;
}
.landing .promotedItem div a.buy, .landing .promotedItem div a.detail {
margin:0 2px;
}
.landing .promotedItem.withDescription {
float:left;
position:relative;
display:block;
background:url(../img/promotedItemDescription.png) no-repeat transparent;
margin-top:3px;
width:377px;
height:82px;
}
.landing .promotedItem.withDescription h4 {
position:absolute;
top:8px;
left:80px;
display:block;
width:190px;
height:14px;
font-size:11px;
font-weight:bold;
color:#7B1300;
border:0 none;
line-height:12px;
}
.landing .promotedItem.withDescription .promotedItemImg img {
position:absolute;
top:11px;
left:6px;
border: 0 none;
display:block;
width:63px;
height:63px;
}
.landing p.promotedItemDescr {
position:absolute;
top:20px;
left:80px;
display:block;
width:180px;
height: 46px;
overflow:auto;
}
.landing .promotedItem.withDescription .promotedItemBtns {
position:absolute;
bottom:10px;
right:8px;
width:100px;
}
.landing .promotedItem p.promotedItemDescr {
clear:none;
float:left;
width:180px;
text-align:left;
overflow:auto;
}
.landing p.discountOldPricePromoted {
position:absolute;
top:27px;
right:8px;
width:48px;
}
.landing .promotedItem div.discountPercentPromoted {
left:6px;
top:6px;
}
.landing .promotedItem div.divdiscount {
width:96px;
}
.landing .promotedItem p.pdiscount {
padding: 3px 0;
}
.landing .divdiscount a.buy, .landing .divdiscount a.detail, .landing .divdiscount a.detail-discount, .landing .divdiscount a.buy-discount {
margin:0 2px;
}
.landing .promotedItem div.promotedItemBtns-discount{
position:absolute;
bottom:10px;
right:8px;
width:100px;
}
.landing div.discountPercentCirclePromoted {
width:32px;
}
.landing .ad {
clear:both;
display:block;
position:absolute;
left:409px;
top:13px;
width: 138px;
height:290px;
background:url(../img/landingAd.jpg) no-repeat;
padding:10px;
text-align:center;
}
.landing .ad h2 {
margin:10px 0;
}
.landing .ad p {
margin:10px 0;
}
.landing .cashback {
background:url(../img/landingAdCashback.jpg) no-repeat;
}
.landing .cashback h2, .landing .cashback p {
margin:0;
color:white;
}
.multipleItemIcon {
background:url(../img/multipleItemIcon.png) no-repeat;
bottom: 9px;
height: 14px;
position: absolute;
right: 9px;
width: 14px;
z-index: 100;
}