633 lines
14 KiB
CSS
633 lines
14 KiB
CSS
a.wheelIcon {
|
|
background:url(../img/wheelIcon.png) no-repeat scroll 0 0 transparent;
|
|
color:white;
|
|
display:block;
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
height:40px;
|
|
left:5px;
|
|
padding:14px 55px 0 0;
|
|
position:absolute;
|
|
text-align:center;
|
|
text-decoration:none;
|
|
top:488px;
|
|
width:95px;
|
|
}
|
|
|
|
a {
|
|
color:#7B1300;
|
|
text-decoration:underline;
|
|
}
|
|
|
|
#wideMainContent h1 {
|
|
display:none;
|
|
}
|
|
|
|
.wheel, .wheelLanding {
|
|
position:relative;
|
|
}
|
|
|
|
.wheel {
|
|
font-size:11px;
|
|
width:570px;
|
|
height:428px;
|
|
background:url(../img/wheel.jpg) no-repeat 0 0;
|
|
}
|
|
|
|
#wideMainContent .wheel h1, #wideMainContent .wheelLanding h1 {
|
|
font-size:16px;
|
|
display:block;
|
|
}
|
|
|
|
#wideMainContent .wheel h1 {
|
|
color:white;
|
|
position:absolute;
|
|
left:70px;
|
|
top:18px;
|
|
}
|
|
|
|
#wideMainContent .wheelLanding{
|
|
position:relative;
|
|
background:url(../img/wideMainContent.jpg) no-repeat;
|
|
width:572px;
|
|
height:430px;
|
|
display:block;
|
|
padding-left:3px;
|
|
padding-top:7px;
|
|
}
|
|
|
|
#wideMainContent .wheelLanding 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;
|
|
}
|
|
|
|
#info {
|
|
position:absolute;
|
|
top:43px;
|
|
left:70px;
|
|
font-size:12px;
|
|
color:white;
|
|
}
|
|
|
|
.info {
|
|
background-image:url(../img/info.png);
|
|
display:block;
|
|
top:5px;
|
|
cursor:pointer;
|
|
height:21px;
|
|
position:absolute;
|
|
right:5px;
|
|
width:21px;
|
|
}
|
|
#wheelLandingButton {
|
|
clear:both;
|
|
display:block;
|
|
position:absolute;
|
|
left:409px;
|
|
top:13px;
|
|
width: 138px;
|
|
height:290px;
|
|
text-align:center;
|
|
}
|
|
|
|
#wheelLandingButton .goToWheel {
|
|
color:#ffffff;
|
|
font-size:12px;
|
|
line-height:23px;
|
|
font-weight:bold;
|
|
text-decoration:none;
|
|
display:block;
|
|
width:135px;
|
|
height:23px;
|
|
margin-bottom:6px;
|
|
}
|
|
|
|
#wheelLandingButton p {
|
|
margin:10px auto;
|
|
}
|
|
|
|
#wheelLandingButton noscript p {
|
|
margin:-7px 0 -2px;
|
|
font-size:10px;
|
|
}
|
|
|
|
#wheelLandingButton h2 {
|
|
margin:65px auto 10px;
|
|
letter-spacing:-0.05em;
|
|
}
|
|
|
|
#wheelLandingButton a {
|
|
font-size:12px;
|
|
}
|
|
|
|
a.goToWheel {
|
|
background:url(../img/goToWheel.png) no-repeat transparent;
|
|
}
|
|
|
|
a.goToWheel:hover {
|
|
background:url(../img/goToWheel-hover.png) no-repeat transparent;
|
|
}
|
|
|
|
.wheelLanding a.buyDR, .wheelLanding 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;
|
|
}
|
|
|
|
.wheelLanding a.buyDR {
|
|
background:url(../img/buyDR.jpg) no-repeat;
|
|
}
|
|
|
|
.wheelLanding a.buyDR:hover {
|
|
background:url(../img/buyDRHover.png) no-repeat;
|
|
}
|
|
|
|
.stageInfo {
|
|
width:98px;
|
|
height:100px;
|
|
position: absolute;
|
|
bottom:0;
|
|
left:0;
|
|
}
|
|
|
|
.stageInfo h2 {
|
|
font-size:11px;
|
|
margin:0;
|
|
}
|
|
|
|
.stageInfo p {
|
|
margin:0 0 6px 0;
|
|
}
|
|
|
|
.main {
|
|
width:430px;
|
|
height:362px;
|
|
position: absolute;
|
|
top:63px;
|
|
left:134px;
|
|
padding:0;
|
|
}
|
|
|
|
#locks div {
|
|
width:42px;
|
|
height:50px;
|
|
text-align:center;
|
|
line-height:20px;
|
|
background:#b00;
|
|
position:absolute;
|
|
left:392px;
|
|
}
|
|
|
|
#locks .open {
|
|
background:url(../img/locks-open.png);
|
|
}
|
|
|
|
#locks .closed {
|
|
background:url(../img/locks-closed.png);
|
|
}
|
|
|
|
#locks .unlockable {
|
|
}
|
|
|
|
#exit {
|
|
position:absolute;
|
|
bottom:8px;
|
|
width:50px;
|
|
height:50px;
|
|
left:388px;
|
|
}
|
|
|
|
#exit img {
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
|
|
.enabled #exitOpen {
|
|
display:block;
|
|
}
|
|
|
|
.enabled #exitClosed {
|
|
display:none;
|
|
}
|
|
|
|
.disabled #exitOpen {
|
|
display:none;
|
|
}
|
|
|
|
.disabled #exitClosed {
|
|
display:block;
|
|
}
|
|
|
|
#wheel, #teasers {
|
|
width:370px;
|
|
height:356px;
|
|
position:relative;
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
|
|
#teasers {
|
|
position:absolute;
|
|
top:0;
|
|
left:0;
|
|
}
|
|
|
|
#teasers .teaser img {
|
|
position:absolute;
|
|
width:40px;
|
|
height:40px;
|
|
display:none;
|
|
}
|
|
|
|
#wheel div.reward, #wheel img.key {
|
|
list-style-type:none;
|
|
width:40px;
|
|
height:40px;
|
|
padding:0;
|
|
color:white;
|
|
text-align:left;
|
|
position:absolute;
|
|
overflow:hidden;
|
|
}
|
|
|
|
#wheel div.reward {
|
|
display:none;
|
|
}
|
|
|
|
#wheel div img {
|
|
line-height:38px;
|
|
height:100%;
|
|
}
|
|
|
|
#wheel img.key {
|
|
width:42px;
|
|
height:42px;
|
|
border:none;
|
|
background-color:transparent;
|
|
}
|
|
|
|
.clockwise #pos1, .clockwise .teaserPos1, .counterClockwise #pos1, .counterClockwise .teaserPos1 { left:164px; top:29px; }
|
|
.clockwise #pos2, .clockwise .teaserPos2, .counterClockwise #pos16, .counterClockwise .teaserPos16 { left:216px; top:39px; }
|
|
.clockwise #pos3, .clockwise .teaserPos3, .counterClockwise #pos15, .counterClockwise .teaserPos15 { left:259px; top:69px; }
|
|
.clockwise #pos4, .clockwise .teaserPos4, .counterClockwise #pos14, .counterClockwise .teaserPos14 { left:289px; top:112px; }
|
|
.clockwise #pos5, .clockwise .teaserPos5, .counterClockwise #pos13, .counterClockwise .teaserPos13 { left:299px; top:164px; }
|
|
.clockwise #pos6, .clockwise .teaserPos6, .counterClockwise #pos12, .counterClockwise .teaserPos12 { left:289px; top:216px; }
|
|
.clockwise #pos7, .clockwise .teaserPos7, .counterClockwise #pos11, .counterClockwise .teaserPos11 { left:259px; top:259px; }
|
|
.clockwise #pos8, .clockwise .teaserPos8, .counterClockwise #pos10, .counterClockwise .teaserPos10 { left:218px; top:289px; }
|
|
.clockwise #pos9, .clockwise .teaserPos9, .counterClockwise #pos9, .counterClockwise .teaserPos9 { left:164px; top:299px; }
|
|
.clockwise #pos10, .clockwise .teaserPos10, .counterClockwise #pos8, .counterClockwise .teaserPos8 { left:112px; top:289px; }
|
|
.clockwise #pos11, .clockwise .teaserPos11, .counterClockwise #pos7, .counterClockwise .teaserPos7 { left:69px; top:259px; }
|
|
.clockwise #pos12, .clockwise .teaserPos12, .counterClockwise #pos6, .counterClockwise .teaserPos6 { left:39px; top:216px; }
|
|
.clockwise #pos13, .clockwise .teaserPos13, .counterClockwise #pos5, .counterClockwise .teaserPos5 { left:29px; top:164px; }
|
|
.clockwise #pos14, .clockwise .teaserPos14, .counterClockwise #pos4, .counterClockwise .teaserPos4 { left:39px; top:112px; }
|
|
.clockwise #pos15, .clockwise .teaserPos15, .counterClockwise #pos3, .counterClockwise .teaserPos3 { left:69px; top:69px; }
|
|
.clockwise #pos16, .clockwise .teaserPos16, .counterClockwise #pos2, .counterClockwise .teaserPos2 { left:112px; top:39px; }
|
|
|
|
.clockwise #key1, .counterClockwise #key1 { left:164px; top:-6px; }
|
|
.clockwise #key2, .counterClockwise #key16 { left:229px; top:7px; }
|
|
.clockwise #key3, .counterClockwise #key15 { left:284px; top:44px; }
|
|
.clockwise #key4, .counterClockwise #key14 { left:321px; top:99px; }
|
|
.clockwise #key5, .counterClockwise #key13 { left:334px; top:164px; }
|
|
.clockwise #key6, .counterClockwise #key12 { left:321px; top:229px; }
|
|
.clockwise #key7, .counterClockwise #key11 { left:284px; top:284px; }
|
|
.clockwise #key8, .counterClockwise #key10 { left:229px; top:321px; }
|
|
.clockwise #key9, .counterClockwise #key9 { left:164px; top:334px; }
|
|
.clockwise #key10, .counterClockwise #key8 { left:99px; top:321px; }
|
|
.clockwise #key11, .counterClockwise #key7 { left:44px; top:284px; }
|
|
.clockwise #key12, .counterClockwise #key6 { left:7px; top:229px; }
|
|
.clockwise #key13, .counterClockwise #key5 { left:-6px; top:164px; }
|
|
.clockwise #key14, .counterClockwise #key4 { left:7px; top:99px; }
|
|
.clockwise #key15, .counterClockwise #key3 { left:44px; top:44px; }
|
|
.clockwise #key16, .counterClockwise #key2 { left:99px; top:7px; }
|
|
|
|
#spinner, #spinnerBlank {
|
|
width:314px;
|
|
height:312px;
|
|
position:absolute;
|
|
left:28px;
|
|
top:29px;
|
|
background:url(../img/spinner.jpg) 0 0 no-repeat;
|
|
}
|
|
|
|
#spinnerBlank {
|
|
background:url(../img/spinner-blank.jpg) 0 0 no-repeat;
|
|
}
|
|
|
|
#spinButton {
|
|
font-size:14px;
|
|
font-weight:bold;
|
|
color:white;
|
|
height:70px;
|
|
left:144px;
|
|
position:absolute;
|
|
top:144px;
|
|
width:82px;
|
|
text-align:center;
|
|
padding:12px 0 0 0;
|
|
cursor:pointer;
|
|
text-decoration:none;
|
|
}
|
|
|
|
.help {
|
|
width:500px;
|
|
padding-bottom:260px;
|
|
}
|
|
|
|
.help h2 {
|
|
margin:7px 0 5px;
|
|
}
|
|
|
|
.help h2 a {
|
|
text-decoration:none;
|
|
}
|
|
|
|
.help p.back {
|
|
margin:6px 0 22px;
|
|
}
|
|
|
|
.backToWheelLink {
|
|
display:block;
|
|
font-size:11px;
|
|
margin:8px 0 5px 0;
|
|
}
|
|
|
|
.wheel p.back {
|
|
margin:4px 0 20px 0;
|
|
}
|
|
|
|
#reward {
|
|
padding:10px 20px;
|
|
border:solid 1px black;
|
|
background:url(../img/reward.png) repeat-y;
|
|
text-align:center;
|
|
}
|
|
|
|
#reward h1 {
|
|
font-size:18px;
|
|
}
|
|
|
|
#reward h2 {
|
|
font-size:14px;
|
|
margin:10px 0 0;
|
|
font-weight:normal;
|
|
text-align:left;
|
|
}
|
|
|
|
#reward img {
|
|
display:block;
|
|
margin:16px auto 10px;
|
|
width:80px;
|
|
height:80px;
|
|
}
|
|
#rewardName {
|
|
margin:0 0 10px;
|
|
font-size:20px;
|
|
}
|
|
|
|
#rewardDesc {
|
|
font-size:14px;
|
|
margin:5px 0 10px;
|
|
text-align:left;
|
|
}
|
|
|
|
#reward div, #hasLeftStage div, #enteredNewStage div {
|
|
background:url(../img/reward-btn.png) no-repeat;
|
|
font-size:14px;
|
|
line-height:22px;
|
|
margin:20px auto 10px;
|
|
text-align:center;
|
|
width:135px;
|
|
height:23px;
|
|
cursor:pointer;
|
|
color:white;
|
|
}
|
|
|
|
#reward div:hover, #hasLeftStage div:hover, #enteredNewStage div:hover {
|
|
background-image:url(../img/reward-btn-hover.png);
|
|
}
|
|
|
|
#reward a {
|
|
font-size:12px;
|
|
}
|
|
|
|
#keyReward {
|
|
margin:25px 0 10px;
|
|
font-size:14px;
|
|
}
|
|
|
|
#hasLeftStage, #enteredNewStage {
|
|
padding:10px;
|
|
border:solid 2px black;
|
|
}
|
|
|
|
#hasLeftStage h1, #enteredNewStage h1 {
|
|
font-size:18px;
|
|
text-align:center;
|
|
}
|
|
|
|
#enteredNewStage h2 {
|
|
font-size: 22px;
|
|
margin: 10px 0 0;
|
|
text-align: center;
|
|
}
|
|
|
|
#hasLeftStage p, #enteredNewStage p {
|
|
font-size:14px;
|
|
margin:10px 0 0;
|
|
}
|
|
|
|
#help {
|
|
position:absolute;
|
|
top:20px;
|
|
right:10px;
|
|
display:block;
|
|
width:38px;
|
|
height:38px;
|
|
}
|
|
|
|
.shopItemTipTip {
|
|
background-color:#FEFAE9 !important;
|
|
border-color:black !important;
|
|
text-shadow:none !important;
|
|
background:url(../img/shopItemTipTip.png) no-repeat !important;
|
|
width:198px !important;
|
|
height:92px !important;
|
|
padding:0 !important;
|
|
}
|
|
#wheel div.shopItemTip {cursor:pointer; border-color:white;}
|
|
.shopItemTipContent, .nonShopItemTipContent {display:none;}
|
|
.shopItem {height:82px; width:180px; position:relative; color:black; margin:5px 9px;}
|
|
.shopItem .itemPic {position:absolute; top:10px; left:10px;}
|
|
.shopItem .itemName {position:absolute; top:9px; left:82px; width:91px; height:28px; font-size:11px; font-weight:normal;letter-spacing:-0.02em;}
|
|
.shopItem .itemNumber {position:absolute; top: 38px; left:82px; width:91px; height:12px; font-size:11px; font-weight:normal; letter-spacing:-0.05em;}
|
|
.shopItem .bonusItemPrice {color:#84080b; font-weight:bold;}
|
|
.shopItem .discount {color:#009000;}
|
|
.shopItem a.itemDetail {position:absolute; top:51px; left:82px; width:44px; height:25px; background-image:url(../img/itemDetail.png); cursor:pointer;}
|
|
.shopItem a.itemBuy {position:absolute; top:51px; left:129px; width:44px; height:25px; background-image:url(../img/itemBuy.png); cursor:pointer;}
|
|
.shopItem a.itemDetail.discount { background-image:url(../img/itemDetail-discount.png); }
|
|
.shopItem a.itemBuy.discount { background-image:url(../img/itemBuy-discount.png); }
|
|
.shopItem a.itemDetail.discount:hover { background-image:url(../img/itemDetail-discount-hover.png); }
|
|
.shopItem a.itemBuy.discount:hover { background-image:url(../img/itemBuy-discount-hover.png); }
|
|
.shopItem .bonusItemPrice.discount { color:#00aa00; }
|
|
|
|
.promotedItem {
|
|
float:left;
|
|
position:relative;
|
|
display:block;
|
|
width:180px;
|
|
height:82px;
|
|
background:url(../img/promotedItem.png) no-repeat transparent;
|
|
margin-top:3px;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
.promotedItem .promotedItemImg img{
|
|
position:absolute;
|
|
top:11px;
|
|
left:6px;
|
|
border: 0 none;
|
|
display:block;
|
|
width:63px;
|
|
height:63px;
|
|
}
|
|
|
|
.promotedItem div, .promotedItem p {
|
|
width:96px;
|
|
}
|
|
|
|
.promotedItem div.promotedItemBtns {
|
|
position:absolute;
|
|
bottom:10px;
|
|
right:8px;
|
|
width:96px;
|
|
}
|
|
|
|
.promotedItem div a.buy, .promotedItem div a.detail {
|
|
margin:0 2px;
|
|
}
|
|
|
|
.promotedItem.withDescription {
|
|
float:left;
|
|
position:relative;
|
|
display:block;
|
|
background:url(../img/promotedItemDescription.png) no-repeat transparent;
|
|
margin-top:3px;
|
|
width:377px;
|
|
height:82px;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
.promotedItem.withDescription .promotedItemImg img{
|
|
position:absolute;
|
|
top:11px;
|
|
left:6px;
|
|
border: 0 none;
|
|
display:block;
|
|
width:63px;
|
|
height:63px;
|
|
}
|
|
|
|
p.promotedItemDescr {
|
|
position:absolute;
|
|
top:20px;
|
|
left:80px;
|
|
display:block;
|
|
width:180px;
|
|
height: 46px;
|
|
overflow:auto;
|
|
}
|
|
|
|
.promotedItem.withDescription .promotedItemBtns {
|
|
position:absolute;
|
|
bottom:10px;
|
|
right:8px;
|
|
width:100px;
|
|
}
|
|
|
|
.promotedItem p.promotedItemDescr {
|
|
clear:none;
|
|
float:left;
|
|
width:180px;
|
|
text-align:left;
|
|
overflow:auto;
|
|
}
|
|
|
|
p.discountOldPricePromoted {
|
|
position:absolute;
|
|
top:27px;
|
|
right:8px;
|
|
width:48px;
|
|
}
|
|
|
|
.promotedItem div.discountPercentPromoted {
|
|
left:6px;
|
|
top:6px;
|
|
}
|
|
|
|
.promotedItem div.divdiscount {
|
|
width:96px;
|
|
}
|
|
|
|
.promotedItem p.pdiscount {
|
|
padding: 3px 0;
|
|
}
|
|
|
|
.divdiscount a.buy, .divdiscount a.detail, .divdiscount a.detail-discount, .divdiscount a.buy-discount {
|
|
margin:0 2px;
|
|
}
|
|
|
|
.promotedItem div.promotedItemBtns-discount{
|
|
position:absolute;
|
|
bottom:10px;
|
|
right:8px;
|
|
width:100px;
|
|
}
|
|
|
|
div.fancyboxContentContainer {
|
|
display:none;
|
|
} |