html.mobile, .mobile body { width: 100%; margin: 0; padding: 0; } .mobile body { overflow-x: hidden; -webkit-text-size-adjust: none; background-color: #c5ccd3; font-family: Helvetica; font-size: 17px; } .mblColorBlue { color: white; background-color: #366edf; background-image: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblColorBlue45 { background-image: -webkit-gradient(linear, left top, right bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblColorDefault { color: white; background-color: #5877a2; background-image: -webkit-gradient(linear, left top, left bottom, from(#222222), color-stop(0.02, #8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblColorDefault45 { background-image: -webkit-gradient(linear, left top, right bottom, from(#222222), color-stop(0.02, #8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblColorDefaultSel { color: white; background-color: #394d77; background-image: -webkit-gradient(linear, left top, left bottom, from(#7c87a4), to(#263e6c), color-stop(0.5, #394d77), color-stop(0.5, #243b69)); } .mblColorDefaultSel45 { background-image: -webkit-gradient(linear, left top, right bottom, from(#7c87a4), to(#263e6c), color-stop(0.5, #394d77), color-stop(0.5, #243b69)); } .mblSpriteIcon { position: absolute; } .mblSpriteIconParent { position: relative; font-size: 1px; } .mblImageIcon { vertical-align: top; } .mblHeading { position: relative; margin: 0; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; z-index: 1; padding: 0; height: 42px; font-family: Helvetica; font-size: 20px; font-weight: bold; text-align: center; line-height: 44px; background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); border-top: 1px solid #cdd5df; border-bottom: 1px solid #2d3642; color: white; text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0; } .mblHeading * { z-index: 2; } .mblHeadingDivTitle { position: absolute; width: 100%; display: none; left: 0; z-index: 1; } .mblHeadingCenterTitle .mblHeadingDivTitle { display: block; } .mblHeadingCenterTitle .mblHeadingSpanTitle { display: none; } .mblSlide { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblSlide.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .3s; } .mblSlide.mblOut.mblReverse.mblTransition, .mblSlide.mblIn { -webkit-transform: translate3d(100%,0px,0px) !important; } .mblSlide.mblOut.mblTransition, .mblSlide.mblIn.mblReverse { -webkit-transform: translate3d(-100%,0px,0px) !important; } .mblSlide.mblOut, .mblSlide.mblIn.mblTransition { -webkit-transform: translate3d(0%,0px,0px) !important; } .dj_android.dj_tablet .mblSlide.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblFlip { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblFlip.mblTransition { -webkit-transition-property: all; -webkit-transition-duration: .2s; -webkit-transition-timing-function: linear; } .mblFlip.mblOut { opacity: 1; -webkit-transform: scale(1,1) skew(0,0) !important; } .mblFlip.mblOut.mblTransition { opacity: 0; -webkit-transform: scale(0,0.8) skew(0,30deg) !important; } .mblFlip.mblIn { opacity: 0; -webkit-transform: scale(0,0.8) skew(0,-30deg) !important; } .mblFlip.mblIn.mblTransition { -webkit-transition-delay: .2s; opacity: 1; -webkit-transform: scale(1,1) skew(0,0) !important; } .dj_android.dj_tablet .mblFlip.mblTransition { -webkit-transition-duration: .4s; } .dj_android.dj_tablet .mblFlip.mblIn.mblTransition { -webkit-transition-delay: .4s; } .mblFade { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblFade.mblTransition { -webkit-transition-property: opacity; -webkit-transition-duration: .6s; } .mblFade.mblOut { opacity: 1; } .mblFade.mblOut.mblTransition { -webkit-transition-timing-function: ease-out; opacity: 0; } .mblFade.mblIn { opacity: 0; } .mblFade.mblIn.mblTransition { -webkit-transition-timing-function: ease-in; opacity: 1; } .mblView { position: relative; top: 0px; left: 0px; width: 100%; } .mblView.mblIn { position: absolute; } .mblFixedHeaderBar { z-index: 1; } .mblFixedBottomBar { position: absolute !important; width: 100%; z-index: 1; } .mblToolBarButton { display: inline-block; position: relative; cursor: pointer; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); margin: 6px; padding: 0 10px; height: 29px; line-height: 29px; text-align: center; font-family: Helvetica; font-size: 13px; font-weight: bold; vertical-align: middle; } .mblToolBarButtonHasIcon, .mblToolBarButtonLightIcon { padding: 0; } .mblHeading .mblToolBarButton { float: left; } .mblHeading span.mblToolBarButtonLightIcon { padding: 0; } .mblToolBarButtonHasLeftArrow { padding-right: 0; } .mblToolBarButtonHasRightArrow { padding-left: 0; } .mblToolBarButtonArrow { position: absolute; top: 5px; width: 20px; height: 19px; border-radius: 1px; -webkit-transform: scale(0.75, 1) rotate(45deg); border: 1px solid #9cacc0; } .mblToolBarButtonHasLeftArrow .mblToolBarButtonArrow { left: 1px; } .mblToolBarButtonHasRightArrow .mblToolBarButtonArrow { right: 0px; } .mblHeading .mblToolBarButtonArrow { border-width: 1px; border-style: solid; border-color: #405a7e #405a7e #3a4755 #3a4755; } .mblHeading .mblToolBarButtonHasLeftArrow .mblToolBarButtonArrow { -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.305); } .mblHeading .mblToolBarButtonHasRightArrow .mblToolBarButtonArrow { -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.305); } .mblToolBarButtonBody { display: inline-block; position: relative; overflow: hidden; border-radius: 5px; border: 1px outset #9cacc0; } .mblToolBarButton .mblToolBarButtonBody { width: 100%; } .mblHeading .mblToolBarButtonBody { border-width: 1px; border-style: solid; border-color: #2f3740 #405a7e #375073 #3a4755; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.305); } .mblToolBarButtonBody table { margin: 0 auto; } .mblToolBarButtonHasLeftArrow .mblToolBarButtonBody { border-left-width: 0; } .mblToolBarButtonHasRightArrow .mblToolBarButtonBody { border-right-width: 0; } .mblToolBarButtonText .mblToolBarButtonIcon { padding-left: 10px; } .mblToolBarButtonText .mblToolBarButtonLabel { padding-right: 10px; } .mblToolBarButtonHasLeftArrow .mblToolBarButtonIcon { padding-left: 4px; } .mblToolBarButtonHasRightArrow .mblToolBarButtonLabel { padding-right: 4px; } .mblToolBarButtonIcon > div { height: 29px; } .mblRoundRect { margin: 7px 9px 16px; padding: 8px; border: 1px solid #adaaad; border-radius: 8px; background-color: white; } .mblRoundRect.mblShadow { -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); } .mblEdgeToEdgeCategory { position: relative; margin: 0; padding: 0 10px; overflow: hidden; font-family: Helvetica; font-size: 16px; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; height: 22px; border-top: 1px solid #a4b0b9; border-bottom: 1px solid #979da3; background-image: -webkit-gradient(linear, left top, left bottom, from(#8f9ea9), to(#b7c0c7)); color: white; line-height: 22px; text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0; } .mblRoundRectCategory { margin: 18px 0 0 20px; padding: 0; font-family: Helvetica; font-size: 16px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: #4c566c; text-shadow: #ffffff 0 1px 0; } .mblRoundRectList { margin: 7px 9px 16px; padding: 0; border: 1px solid #adaaad; border-radius: 8px; background-color: white; } .mblRoundRectList .mblListItem:first-child, .mblRoundRectList .mblEdgeToEdgeCategory:first-child { border-top-left-radius: 8px; border-top-right-radius: 8px; } .mblRoundRectList .mblListItem:last-child, .mblRoundRectList .mblEdgeToEdgeCategory:last-child { border-bottom-width: 0; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } .mblEdgeToEdgeList { margin: 0; padding: 0; background-color: white; } .mblEdgeToEdgeList .mblListItem:last-child { border-bottom-color: #707c84; } .mblDomButtonGrayArrow, .mblDomButtonArrow { position: relative; width: 20px; height: 29px; } .mblDomButtonGrayArrow > div, .mblDomButtonArrow > div { position: absolute; top: 10px; left: 6px; width: 6px; height: 6px; font-size: 1px; -webkit-transform: rotate(45deg); border-width: 3px 3px 0px 0px; border-style: solid; border-color: #808080; } .mblDomButtonDarkBlueCheck, .mblDomButtonCheck { position: relative; width: 20px; height: 29px; } .mblDomButtonDarkBlueCheck > div, .mblDomButtonCheck > div { position: absolute; left: 0px; top: 8px; width: 16px; height: 6px; font-size: 1px; -webkit-transform: scaleX(0.7) rotate(135deg); border-width: 3px 4px 0px 0px; border-style: solid; border-color: #314e84; } .mblListItem { position: relative; overflow: hidden; padding: 0 8px; height: 43px; list-style-type: none; line-height: 43px; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); border-bottom: 1px solid #adaaad; font-weight: bold; color: black; } .mblListItem.mblVariableHeight { padding: 11px 8px; height: auto; line-height: normal; } .mblListItemSelected { color: white; background-image: -webkit-gradient(linear, left top, left bottom, from(#048bf4), to(#005ce5)); } .mblListItemSelected .mblDomButton div { border-color: white; } .mblListItemLabelSelected { background-color: #048bf4; } .mblListItemChecked { color: #314e84; } .mblListItemChecked .mblListItemRightIcon { visibility: visible; } .mblListItemChecked .mblListItemUncheckIcon { position: absolute; visibility: hidden; } .mblListItemUnchecked .mblListItemRightIcon { visibility: hidden; } .mblListItemUnchecked .mblListItemUncheckIcon { visibility: visible; } .mblListItemDeleteIcon { position: relative; float: left; line-height: normal; margin-top: 7px; margin-bottom: -7px; margin-right: 11px; } .mblListItemIcon { position: relative; float: left; line-height: normal; margin-top: 7px; margin-bottom: -7px; margin-right: 11px; } .mblListItemRightIcon, .mblListItemRightIcon2, .mblListItemUncheckIcon { position: relative; float: right; line-height: normal; margin-top: 7px; margin-bottom: -7px; } .mblListItemRightText { position: relative; float: right; line-height: normal; margin-right: 4px; color: #324f85; margin-top: 12px; } .mblListItemLabel { position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; height: 100%; } .mblVariableHeight .mblListItemLabel { white-space: normal; } .mblListItemLayoutLeft { position: relative; float: left; margin-right: 11px; } .mblListItemLayoutCenter { position: absolute; width: 100%; text-align: center; } .mblListItemLayoutRight { position: relative; float: right; } .mblListItemFloat { position: absolute; border: 1px solid gray; opacity: 0.5; -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; } .mblSwitch { margin: 0; position: relative; display: inline-block; height: 27px; line-height: 29px; overflow: hidden; text-align: left; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .mblListItem .mblSwitch { position: absolute; right: 12px; top: 8px; } .mblSwitchInner { position: absolute; top: 0; height: 27px; } .mblSwitchAnimation .mblSwitchInner { -webkit-transition-property: left; -webkit-transition-duration: .1s; } .mblSwitchOn .mblSwitchInner { left: 0; } .mblSwitchBg { position: absolute; top: 0; width: 94px; height: 27px; font-family: Helvetica; font-size: 16px; font-weight: bold; line-height: 29px; -webkit-box-sizing: border-box; border-width: 1px; border-style: solid; border-color: #939393 #aaaaaa #cbcbcb #767676; } .mblSwitchBgLeft { left: 0; color: white; background-color: #3f84eb; background-image: -webkit-gradient(linear, left top, left bottom, from(#2859b1), to(#75acfb), color-stop(0.5, #3f84eb), color-stop(0.5, #4c8eee)); } .mblSwitchBgRight { color: #7f7f7f; background-image: -webkit-gradient(linear, left top, left bottom, from(#cecece), to(#fdfdfd), color-stop(0.5, #eeeeee), color-stop(0.5, #f8f8f8)); } .mblSwitchKnob { position: absolute; top: 0; height: 27px; background-image: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#fafafa)); font-size: 1px; -webkit-box-sizing: border-box; border-width: 1px; border-style: solid; border-color: #5e5e5e #9e9e9e #828282 #797979; } .mblSwitchText { position: relative; top: 0; width: 53px; height: 27px; padding: 0; line-height: 28px; text-align: center; } .mblSwitchTextLeft { left: 0; } .mblSwitchTextRight { left: 40px; } .mblSwSquareShape { width: 94px; } .mblSwSquareShape.mblSwitchOff .mblSwitchInner { left: -53px; } .mblSwSquareShape .mblSwitchBg { border-radius: 5px; } .mblSwSquareShape .mblSwitchBgRight { left: 53px; } .mblSwSquareShape .mblSwitchKnob { left: 53px; width: 41px; border-radius: 5px; } .mblSwSquareShape .mblSwitchText { width: 53px; } .mblSwSquareShape .mblSwitchTextRight { left: 40px; } .mblSwRoundShape1 { width: 77px; } .mblSwRoundShape1.mblSwitchOff .mblSwitchInner { left: -50px; } .mblSwRoundShape1 .mblSwitchBg { width: 77px; border-radius: 14px; } .mblSwRoundShape1 .mblSwitchBgRight { left: 50px; } .mblSwRoundShape1 .mblSwitchKnob { left: 50px; width: 27px; border-radius: 13px; } .mblSwRoundShape1 .mblSwitchText { width: 50px; } .mblSwRoundShape1 .mblSwitchTextRight { left: 26px; } .mblSwRoundShape2 { width: 94px; } .mblSwRoundShape2.mblSwitchOff .mblSwitchInner { left: -51px; } .mblSwRoundShape2 .mblSwitchBg { border-radius: 14px; } .mblSwRoundShape2 .mblSwitchBgRight { left: 51px; } .mblSwRoundShape2 .mblSwitchKnob { left: 51px; width: 43px; border-radius: 13px; } .mblSwRoundShape2 .mblSwitchText { width: 51px; } .mblSwRoundShape2 .mblSwitchTextRight { left: 42px; } .mblSwArcShape1 { width: 77px; } .mblSwArcShape1.mblSwitchOff .mblSwitchInner { left: -50px; } .mblSwArcShape1 .mblSwitchBg { width: 77px; border-radius: 5px/14px; } .mblSwArcShape1 .mblSwitchBgRight { left: 50px; } .mblSwArcShape1 .mblSwitchKnob { left: 50px; width: 27px; border-radius: 5px/13px; } .mblSwArcShape1 .mblSwitchText { width: 50px; } .mblSwArcShape1 .mblSwitchTextRight { left: 26px; } .mblSwArcShape2 { width: 94px; } .mblSwArcShape2.mblSwitchOff .mblSwitchInner { left: -51px; } .mblSwArcShape2 .mblSwitchBg { border-radius: 5px/14px; } .mblSwArcShape2 .mblSwitchBgRight { left: 51px; } .mblSwArcShape2 .mblSwitchKnob { left: 51px; width: 43px; border-radius: 5px/13px; } .mblSwArcShape2 .mblSwitchText { width: 51px; } .mblSwArcShape2 .mblSwitchTextRight { left: 42px; } .mblSwDefaultShape { width: 77px; } .mblSwDefaultShape.mblSwitchOff .mblSwitchInner { left: -50px; } .mblSwDefaultShape .mblSwitchBg { width: 77px; border-radius: 14px; } .mblSwDefaultShape .mblSwitchBgRight { left: 50px; } .mblSwDefaultShape .mblSwitchKnob { left: 50px; width: 27px; border-radius: 13px; } .mblSwDefaultShape .mblSwitchText { width: 50px; } .mblSwDefaultShape .mblSwitchTextRight { left: 26px; } .mblProgressIndicator { position: relative; top: 0px; } .mblHeading .mblProgressIndicator { margin: 5px; float: left; } .mblProgContainer { position: absolute; width: 100%; height: 100%; } .mblProgressIndicatorCenter { position: absolute; top: 180px; left: 50%; } .mblProgressIndicatorCenter .mblProgContainer { left: -50%; -webkit-transform-origin: 50% 0; } .mblProg { position: absolute; left: 2px; top: 0px; width: 11px; font-size: 1px; height: 4px; overflow: hidden; -webkit-transform-origin: 0 2px; background-color: #c0c0c0; border-radius: 2px; } .mblProg0 { -webkit-transform: translate(18px, 10px) rotate(-90.1deg); } .mblProg1 { -webkit-transform: translate(22px, 11px) rotate(-60deg); } .mblProg2 { -webkit-transform: translate(25px, 14px) rotate(-30deg); } .mblProg3 { -webkit-transform: translate(26px, 18px) rotate(0deg); } .mblProg4 { -webkit-transform: translate(25px, 22px) rotate(30deg); } .mblProg5 { -webkit-transform: translate(22px, 25px) rotate(60deg); } .mblProg6 { -webkit-transform: translate(18px, 26px) rotate(90.1deg); } .mblProg7 { -webkit-transform: translate(14px, 25px) rotate(120deg); } .mblProg8 { -webkit-transform: translate(11px, 22px) rotate(150deg); } .mblProg9 { -webkit-transform: translate(10px, 18px) rotate(180deg); } .mblProg10 { -webkit-transform: translate(11px, 14px) rotate(210deg); } .mblProg11 { -webkit-transform: translate(14px, 11px) rotate(240deg); } .mblProg0Color { background-color: #c0c0c0; } .mblProg1Color { background-color: #c0c0c0; } .mblProg2Color { background-color: #c0c0c0; } .mblProg3Color { background-color: #c0c0c0; } .mblProg4Color { background-color: #c0c0c0; } .mblProg5Color { background-color: #c0c0c0; } .mblProg6Color { background-color: #b8b9b8; } .mblProg7Color { background-color: #aeafae; } .mblProg8Color { background-color: #a4a5a4; } .mblProg9Color { background-color: #9a9a9a; } .mblProg10Color { background-color: #8e8e8e; } .mblProg11Color { background-color: #838383; } .mblProgWhite .mblProg0Color { background-color: #adb9c9; } .mblProgWhite .mblProg1Color { background-color: #adb9c9; } .mblProgWhite .mblProg2Color { background-color: #adb9c9; } .mblProgWhite .mblProg3Color { background-color: #adb9c9; } .mblProgWhite .mblProg4Color { background-color: #adb9c9; } .mblProgWhite .mblProg5Color { background-color: #adb9c9; } .mblProgWhite .mblProg6Color { background-color: #acb9cb; } .mblProgWhite .mblProg7Color { background-color: #b7c2d2; } .mblProgWhite .mblProg8Color { background-color: #c4cdda; } .mblProgWhite .mblProg9Color { background-color: #d1d8e2; } .mblProgWhite .mblProg10Color { background-color: #dee3ea; } .mblProgWhite .mblProg11Color { background-color: #eceff3; } .mblDomButtonWhitePlus { position: relative; width: 29px; height: 29px; } .mblDomButtonWhitePlus > div { position: absolute; top: 12px; left: 8px; width: 13px; height: 3px; margin: 0px; font-size: 1px; background-color: white; border-top: 1px solid #4a5a71; } .mblDomButtonWhitePlus > div > div { position: absolute; top: -6px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; border-top: 1px solid #4a5a71; } .mblDomButtonWhiteMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteMinus > div { position: absolute; top: 12px; left: 8px; width: 13px; height: 3px; margin: 0px; font-size: 1px; background-color: white; border-top: 1px solid #4a5a71; } .mblDomButtonWhiteUpArrow { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteUpArrow div { position: absolute; left: 0px; clip: rect(0px 30px 20px 0px); } .mblDomButtonWhiteUpArrow > div > div { top: 9px; left: 4px; width: 20px; height: 20px; margin: 0px; font-size: 1px; background-color: white; border-top: 1px solid #4a5a71; -webkit-transform: scaleX(0.6) rotate(45deg); } .mblDomButtonWhiteDownArrow { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteDownArrow div { position: absolute; left: 0px; clip: rect(7px 50px 40px 0px); } .mblDomButtonWhiteDownArrow > div > div { top: -10px; left: 2px; width: 25px; height: 25px; margin: 0px; font-size: 1px; background-color: white; border-top: 1px solid #4a5a71; -webkit-transform: scaleX(0.6) rotate(45deg); } .mblDomButtonWhiteSearch { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteSearch > div { position: absolute; top: 5px; left: 6px; width: 10px; height: 10px; margin: 0px; font-size: 1px; border: 2px solid white; border-radius: 6px; } .mblDomButtonWhiteSearch > div > div { position: absolute; top: 10px; left: 7px; width: 8px; height: 3px; margin: 0px; font-size: 1px; background-color: white; border: none; -webkit-transform: rotate(45deg); border-radius: 0px; } .mblDomButtonBlueMinus, .mblDomButtonBluePlus, .mblDomButtonDarkBlueMinus, .mblDomButtonDarkBluePlus, .mblDomButtonRedMinus, .mblDomButtonRedPlus { position: relative; width: 29px; height: 29px; } .mblDomButtonBlueMinus > div, .mblDomButtonBluePlus > div, .mblDomButtonDarkBlueMinus > div, .mblDomButtonDarkBluePlus > div, .mblDomButtonRedMinus > div, .mblDomButtonRedPlus > div { position: relative; top: 4px; left: 3px; width: 22px; height: 18px; border-width: 1px 1px 1px 0px; border-style: outset; color: white; border-radius: 3px; } .mblDomButtonBlueMinus > div, .mblDomButtonBluePlus > div { border-color: #6d89c7; background-color: #366edf; background: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblDomButtonDarkBlueMinus > div, .mblDomButtonDarkBluePlus > div { border-color: #6d89c7; background-color: #5877a2; background: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblDomButtonRedMinus > div, .mblDomButtonRedPlus > div { border-color: #cc1122; background-color: #c9404b; background: -webkit-gradient(linear, left top, left bottom, from(#d3656d), to(#bc1320), color-stop(0.5, #c9404b), color-stop(0.5, #bc1421)); } .mblDomButtonBlueMinus > div > div, .mblDomButtonBluePlus > div > div, .mblDomButtonDarkBlueMinus > div > div, .mblDomButtonDarkBluePlus > div > div, .mblDomButtonRedMinus > div > div, .mblDomButtonRedPlus > div > div { position: absolute; top: 7px; left: 7px; width: 8px; height: 2px; margin: 0px; font-size: 1px; border-style: none; background: white; border-top: 1px solid #4a5a71; } .mblDomButtonBluePlus > div > div > div, .mblDomButtonDarkBluePlus > div > div > div, .mblDomButtonRedPlus > div > div > div { position: absolute; top: -3px; left: 3px; width: 2px; height: 8px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonCheckboxOn { position: relative; width: 30px; height: 30px; border-width: 1px; border-style: outset; border-color: #a5a2a5; color: white; border-radius: 3px; background-color: #d6d3d6; background: -webkit-gradient(linear, left top, left bottom, from(#eff3ef), to(#bdbebd)); } .mblDomButtonCheckboxOn > div { position: absolute; top: 15px; left: 3px; width: 14px; height: 4px; margin: 0px; font-size: 1px; background-color: #00cf00; border-top: 1px solid #4a5a71; border-radius: 2px; -webkit-transform: rotate(50deg); } .mblDomButtonCheckboxOn > div > div { position: absolute; top: -10px; left: 0px; width: 20px; height: 4px; margin: 0px; font-size: 1px; background-color: #00cf00; border-top: none; border-bottom: 1px solid #4a5a71; border-radius: 2px; -webkit-transform: rotate(-100deg); } .mblDomButtonCheckboxOff { position: relative; width: 30px; height: 30px; border-width: 1px; border-style: outset; border-color: #a5a2a5; color: white; border-radius: 3px; background-color: #d6d3d6; background: -webkit-gradient(linear, left top, left bottom, from(#eff3ef), to(#bdbebd)); } .mblDomButtonCheckboxOff > div { position: absolute; top: 15px; left: 3px; width: 14px; height: 4px; margin: 0px; font-size: 1px; background-color: #bdbabd; border-bottom: 1px solid #8c8e8c; border-radius: 2px; -webkit-transform: rotate(50deg); } .mblDomButtonCheckboxOff > div > div { position: absolute; top: -10px; left: 0px; width: 20px; height: 4px; margin: 0px; font-size: 1px; background-color: #bdbabd; border-bottom: none; border-top: 1px solid #8c8e8c; border-radius: 2px; -webkit-transform: rotate(-100deg); } .mblDomButtonBlueCircleMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonBlueCircleMinus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonBlueCircleMinus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#6ba2e7), to(#216dd6), color-stop(0.5, #4282de), color-stop(0.5, #216dd6)); } .mblDomButtonBlueCircleMinus > div > div > div { position: absolute; top: 8px; left: 3px; width: 12px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonBlueCirclePlus { position: relative; width: 29px; height: 29px; } .mblDomButtonBlueCirclePlus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonBlueCirclePlus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#6ba2e7), to(#216dd6), color-stop(0.5, #4282de), color-stop(0.5, #216dd6)); } .mblDomButtonBlueCirclePlus > div > div > div { position: absolute; top: 8px; left: 3px; width: 13px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonBlueCirclePlus > div > div > div > div { position: absolute; top: -5px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonBlueCircleArrow { position: relative; width: 29px; height: 29px; } .mblDomButtonBlueCircleArrow > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonBlueCircleArrow > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#6ba2e7), to(#216dd6), color-stop(0.5, #4282de), color-stop(0.5, #216dd6)); } .mblDomButtonBlueCircleArrow > div > div > div { position: absolute; top: 5px; left: 6px; width: 8px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; -webkit-transform: rotate(45deg); } .mblDomButtonBlueCircleArrow > div > div > div > div { position: absolute; top: 1px; left: 6px; width: 3px; height: 8px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonRedCircleMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonRedCircleMinus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonRedCircleMinus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#d3656d), to(#bc1320), color-stop(0.5, #c9404b), color-stop(0.5, #bc1421)); } .mblDomButtonRedCircleMinus > div > div > div { position: absolute; top: 8px; left: 3px; width: 12px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonRedCirclePlus { position: relative; width: 29px; height: 29px; } .mblDomButtonRedCirclePlus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonRedCirclePlus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#d3656d), to(#bc1320), color-stop(0.5, #c9404b), color-stop(0.5, #bc1421)); } .mblDomButtonRedCirclePlus > div > div > div { position: absolute; top: 8px; left: 3px; width: 13px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonRedCirclePlus > div > div > div > div { position: absolute; top: -5px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonRedCircleArrow { position: relative; width: 29px; height: 29px; } .mblDomButtonRedCircleArrow > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonRedCircleArrow > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#d3656d), to(#bc1320), color-stop(0.5, #c9404b), color-stop(0.5, #bc1421)); } .mblDomButtonRedCircleArrow > div > div > div { position: absolute; top: 5px; left: 6px; width: 8px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; -webkit-transform: rotate(45deg); } .mblDomButtonRedCircleArrow > div > div > div > div { position: absolute; top: 1px; left: 6px; width: 3px; height: 8px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonGreenCircleMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonGreenCircleMinus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonGreenCircleMinus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#7be75a), to(#398c08), color-stop(0.5, #6bc642), color-stop(0.5, #4aad21)); } .mblDomButtonGreenCircleMinus > div > div > div { position: absolute; top: 8px; left: 3px; width: 12px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonGreenCirclePlus { position: relative; width: 29px; height: 29px; } .mblDomButtonGreenCirclePlus > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonGreenCirclePlus > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#7be75a), to(#398c08), color-stop(0.5, #6bc642), color-stop(0.5, #4aad21)); } .mblDomButtonGreenCirclePlus > div > div > div { position: absolute; top: 8px; left: 3px; width: 13px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; } .mblDomButtonGreenCirclePlus > div > div > div > div { position: absolute; top: -5px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonGreenCircleArrow { position: relative; width: 29px; height: 29px; } .mblDomButtonGreenCircleArrow > div { position: relative; top: 2px; left: 2px; width: 22px; height: 22px; border: 1px solid #b5b6b5; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonGreenCircleArrow > div > div { position: relative; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 9px; background: -webkit-gradient(linear, left top, left bottom, from(#7be75a), to(#398c08), color-stop(0.5, #6bc642), color-stop(0.5, #4aad21)); } .mblDomButtonGreenCircleArrow > div > div > div { position: absolute; top: 5px; left: 6px; width: 8px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background: white; -webkit-transform: rotate(45deg); } .mblDomButtonGreenCircleArrow > div > div > div > div { position: absolute; top: 1px; left: 6px; width: 3px; height: 8px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonBlackCircleCross { position: relative; width: 29px; height: 29px; } .mblDomButtonBlackCircleCross > div { position: relative; top: 3px; left: 3px; width: 23px; height: 23px; background-color: white; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonBlackCircleCross > div > div { position: relative; top: 2px; left: 2px; width: 19px; height: 19px; background-color: black; border-radius: 10px; } .mblDomButtonBlackCircleCross > div > div > div { position: absolute; top: 8px; left: 3px; width: 13px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background-color: white; -webkit-transform: rotate(45deg); border-radius: 1px; } .mblDomButtonBlackCircleCross > div > div > div > div { position: absolute; top: -5px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; border-radius: 1px; } .mblDomButtonGrayRoundRect { position: relative; width: 29px; height: 29px; text-align: right; } .mblDomButtonGrayRoundRect > div { position: absolute; right: 0px; display: inline; padding: 0px 5px; top: 7px; color: white; font-family: Helvetica; font-size: 12px; border-radius: 4px; background-color: #949ba5; text-align: center; } .mblDomButtonGrayRoundRect > div > div { display: none; } .mblDomButtonSilverCircleDownArrow { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleDownArrow > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleDownArrow > div > div { position: relative; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 10px; background: -webkit-gradient(linear, left top, left bottom, from(#979797), to(#616161)); } .mblDomButtonSilverCircleDownArrow > div > div > div { position: absolute; left: 0px; clip: rect(6px 50px 40px 0px); } .mblDomButtonSilverCircleDownArrow > div > div > div > div { position: absolute; top: -5px; left: 1px; width: 18px; height: 18px; margin: 0px; font-size: 1px; background-color: #d1d1d1; border-top: 1px solid #4a5a71; -webkit-transform: scaleX(0.7) rotate(45deg); } .mblDomButtonSilverCircleGreenButton { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleGreenButton > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleGreenButton > div > div { position: relative; top: 6px; left: 6px; width: 12px; height: 12px; border: 1px inset #1b991c; border-radius: 7px; background: -webkit-gradient(radial, center center, 0, center center, 6, from(#17df25), to(#1ba51c)); } .mblDomButtonSilverCircleGrayButton { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleGrayButton > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleGrayButton > div > div { position: relative; top: 6px; left: 6px; width: 12px; height: 12px; border: 1px inset #aeaeae; border-radius: 7px; background: -webkit-gradient(linear, left top, left bottom, from(#d4d4d4), to(#bababa)); } .mblDomButtonSilverCircleOrangeButton { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleOrangeButton > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleOrangeButton > div > div { position: relative; top: 6px; left: 6px; width: 12px; height: 12px; border: 1px inset #ca701a; border-radius: 7px; background: -webkit-gradient(radial, center center, 0, center center, 6, from(#ff7a07), to(#e66b03)); } .mblDomButtonSilverCircleGreenPlus { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleGreenPlus > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleGreenPlus > div > div { position: absolute; top: 11px; left: 4px; width: 18px; height: 4px; margin: 0px; font-size: 1px; background-color: #17df25; } .mblDomButtonSilverCircleGreenPlus > div > div > div { position: absolute; top: -7px; left: 7px; width: 4px; height: 18px; margin: 0px; font-size: 1px; background-color: #17df25; } .mblDomButtonSilverCircleRedCross { position: relative; width: 30px; height: 30px; } .mblDomButtonSilverCircleRedCross > div { position: relative; top: 0px; left: 0px; width: 26px; height: 26px; border: 1px solid #b5b6b5; border-radius: 13px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#c2c2c2)); } .mblDomButtonSilverCircleRedCross > div > div { position: absolute; top: 11px; left: 4px; width: 18px; height: 4px; margin: 0px; font-size: 1px; background-color: #f00e5a; -webkit-transform: rotate(45deg); } .mblDomButtonSilverCircleRedCross > div > div > div { position: absolute; top: -7px; left: 7px; width: 4px; height: 18px; margin: 0px; font-size: 1px; background-color: #f00e5a; } .mblDomButtonBlueBall { position: relative; width: 19px; height: 29px; } .mblDomButtonBlueBall > div { position: relative; top: 8px; left: 4px; width: 14px; height: 14px; border-radius: 7px; background: -webkit-gradient(linear, left top, left bottom, from(#84aff4), to(#2758b3)); } .mblDomButtonGreenBall { position: relative; width: 19px; height: 29px; } .mblDomButtonGreenBall > div { position: relative; top: 8px; left: 4px; width: 14px; height: 14px; border-radius: 7px; background: -webkit-gradient(linear, left top, left bottom, from(#59e738), to(#0aa908)); } .mblDomButtonOrangeBall { position: relative; width: 19px; height: 29px; } .mblDomButtonOrangeBall > div { position: relative; top: 8px; left: 4px; width: 14px; height: 14px; border-radius: 7px; background: -webkit-gradient(linear, left top, left bottom, from(#f9e20a), to(#ff6b0a)); } .mblDomButtonRedBall { position: relative; width: 19px; height: 29px; } .mblDomButtonRedBall > div { position: relative; top: 8px; left: 4px; width: 14px; height: 14px; border-radius: 7px; background: -webkit-gradient(linear, left top, left bottom, from(#ec9b9d), to(#d73c3f)); } .mblDomButtonTransparent19 { position: relative; width: 19px; height: 19px; } .mblDomButtonTransparent29 { position: relative; width: 29px; height: 29px; } .mblDomButtonTransparent30 { position: relative; width: 30px; height: 30px; } .mblDomButtonYellowStar { position: relative; width: 29px; height: 29px; } .mblDomButtonYellowStar > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #ffff00 transparent transparent transparent; top: 12px; left: 3px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(0deg); } .mblDomButtonYellowStar > div > div { position: absolute; width: 24px; height: 0px; border-style: solid; border-color: #cd853f; border-width: 1px 0px 0px 0px; top: -10px; left: -12px; } .mblDomButtonYellowStar > div > div > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #ffff00 transparent transparent transparent; top: 0px; left: 0px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(72deg); } .mblDomButtonYellowStar > div > div > div > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #ffff00 transparent transparent transparent; top: -10px; left: -12px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(216deg); } .mblDomButtonGrayStar { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayStar > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #bdbabd transparent transparent transparent; top: 12px; left: 3px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(0deg); } .mblDomButtonGrayStar > div > div { position: absolute; width: 24px; height: 0px; border-style: solid; border-color: #8c8e8c; border-width: 1px 0px 0px 0px; top: -10px; left: -12px; } .mblDomButtonGrayStar > div > div > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #bdbabd transparent transparent transparent; top: 0px; left: 0px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(72deg); } .mblDomButtonGrayStar > div > div > div > div { position: absolute; width: 0px; height: 0px; border-style: solid; border-color: #bdbabd transparent transparent transparent; top: -10px; left: -12px; border-width: 9px 12px 0px 12px; -webkit-transform: rotate(216deg); } .mblDomButtonGrayCross { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayCross > div { position: absolute; top: 12px; left: 7px; width: 14px; height: 2px; margin: 0px; font-size: 1px; border: 1px solid #0d1721; background-color: #6c6e6d; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); border-radius: 2px; } .mblDomButtonGrayCross > div > div { position: absolute; top: -7px; left: 5px; width: 2px; height: 14px; margin: 0px; font-size: 1px; border: 1px solid #0d1721; background-color: #6c6e6d; border-radius: 2px; } .mblDomButtonRedCross { position: relative; width: 29px; height: 29px; } .mblDomButtonRedCross > div { position: absolute; top: 12px; left: 7px; width: 14px; height: 2px; margin: 0px; font-size: 1px; border: 1px solid #ad3213; background-color: #e54d1f; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); border-radius: 2px; } .mblDomButtonRedCross > div > div { position: absolute; top: -7px; left: 5px; width: 2px; height: 14px; margin: 0px; font-size: 1px; border: 1px solid #ad3213; background-color: #e54d1f; border-radius: 2px; } .mblDomButtonWhiteCross { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteCross > div { position: absolute; top: 12px; left: 7px; width: 14px; height: 2px; margin: 0px; font-size: 1px; border: 1px solid #808080; background-color: #ffffff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); border-radius: 2px; } .mblDomButtonWhiteCross > div > div { position: absolute; top: -7px; left: 5px; width: 2px; height: 14px; margin: 0px; font-size: 1px; border: 1px solid #808080; background-color: #ffffff; border-radius: 2px; } .mblDomButtonGrayKnob { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayKnob > div { position: absolute; top: 6px; left: 2px; width: 23px; height: 3px; margin: 0px; font-size: 1px; background-color: #cecfce; border-width: 1px 1px 0 0; border-style: solid; border-color: #9c9e9c; } .mblDomButtonGrayKnob > div > div { position: absolute; top: 6px; width: 23px; height: 3px; background-color: #cecfce; border-width: 1px 1px 0 0; border-style: solid; border-color: #9c9e9c; } .mblDomButtonGrayKnob > div > div > div { position: absolute; top: 6px; width: 23px; height: 3px; background-color: #cecfce; border-width: 1px 1px 0 0; border-style: solid; border-color: #9c9e9c; } .mblDomButtonGrayPlus { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayPlus > div { position: absolute; top: 12px; left: 6px; width: 18px; height: 3px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-radius: 2px; } .mblDomButtonGrayPlus > div > div { position: absolute; top: -8px; left: 7px; width: 3px; height: 17px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-left: 1px solid #808080; border-radius: 2px; } .mblDomButtonGrayMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayMinus > div { position: absolute; top: 12px; left: 6px; width: 18px; height: 3px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-radius: 2px; } .mblDissolve.mblOut { -webkit-animation-duration: 1s; -webkit-animation-name: mblDissolveOut; -webkit-animation-timing-function: cubic-bezier(.25,1,.75,0); } .mblDissolve.mblIn { -webkit-animation-duration: 1s; -webkit-animation-name: mblDissolveIn; -webkit-animation-timing-function: cubic-bezier(.25,1,.75,0); } @-webkit-keyframes mblDissolveOut { from { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes mblDissolveIn { from { opacity: 0; } to { opacity: 1; } } .mblCover { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblCover.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblCover.mblOut { z-index: -100; -webkit-transform: translate3d(0%,0px,-1px) !important; } .mblCover.mblIn { -webkit-transform: translate3d(100%,0px,0px) !important; } .mblCover.mblIn.mblReverse { -webkit-transform: translate3d(-100%,0px,0px) !important; } .mblCover.mblOut.mblTransition, .mblCover.mblIn.mblTransition { -webkit-transform: translate3d(0%,0px,0px) !important; } .dj_android.dj_tablet .mblCover.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblCube { -webkit-animation-duration: .8s; -webkit-animation-timing-function: linear; } .mblCube.mblOut { -webkit-animation-name: mblCubeOut; -webkit-transform-origin: 0% 50% !important; } .mblCube.mblIn { -webkit-animation-name: mblCubeIn; -webkit-transform-origin: 100% 50% !important; } @-webkit-keyframes mblCubeOut { 0% { -webkit-transform: scale(1,1) skew(0deg,0deg); } 50% { -webkit-transform: scale(.5,1) skew(0deg,3deg); } 100% { -webkit-transform: scale(0,1) skew(0deg,0deg); } } @-webkit-keyframes mblCubeIn { 0% { -webkit-transform: scale(0,1) skew(0deg,0deg); } 50% { -webkit-transform: scale(.5,1) skew(0deg,-3deg); } 100% { -webkit-transform: scale(1,1) skew(0deg,0deg); } } .mblCube.mblOut.mblReverse { -webkit-animation-name: mblCubeOutReverse; -webkit-transform-origin: 100% 50% !important; } .mblCube.mblIn.mblReverse { -webkit-animation-name: mblCubeInReverse; -webkit-transform-origin: 0% 50% !important; } @-webkit-keyframes mblCubeOutReverse { 0% { -webkit-transform: scale(1,1) skew(0deg,0deg); } 50% { -webkit-transform: scale(.5,1) skew(0deg,-3deg); } 100% { -webkit-transform: scale(0,1) skew(0deg,0deg); } } @-webkit-keyframes mblCubeInReverse { 0% { -webkit-transform: scale(0,1) skew(0deg,0deg); } 50% { -webkit-transform: scale(.5,1) skew(0deg,3deg); } 100% { -webkit-transform: scale(1,1) skew(0deg,0deg); } } .dj_iphone .mblCube { -webkit-transform-style: preserve-3d !important; } .dj_iphone .mblCube.mblOut { -webkit-animation-name: mblCubeOut_iphone; -webkit-transform-origin: 50% 50% !important; } .dj_iphone .mblCube.mblIn { -webkit-animation-name: mblCubeIn_iphone; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOut_iphone { from { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(0deg) translateZ(160px); } to { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(-90deg) translateZ(160px); } } @-webkit-keyframes mblCubeIn_iphone { from { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(90deg) translateZ(160px); } to { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(0deg) translateZ(160px); } } .dj_iphone.dj_landscape .mblCube.mblOut { -webkit-animation-name: mblCubeOut_iphone_l; -webkit-transform-origin: 50% 50% !important; } .dj_iphone.dj_landscape .mblCube.mblIn { -webkit-animation-name: mblCubeIn_iphone_l; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOut_iphone_l { from { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(0deg) translateZ(240px); } to { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(-90deg) translateZ(240px); } } @-webkit-keyframes mblCubeIn_iphone_l { from { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(90deg) translateZ(240px); } to { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(0deg) translateZ(240px); } } .dj_iphone .mblCube.mblOut.mblReverse { -webkit-animation-name: mblCubeOutReverse_iphone; -webkit-transform-origin: 50% 50% !important; } .dj_iphone .mblCube.mblIn.mblReverse { -webkit-animation-name: mblCubeInReverse_iphone; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOutReverse_iphone { from { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(0deg) translateZ(160px); } to { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(90deg) translateZ(160px); } } @-webkit-keyframes mblCubeInReverse_iphone { from { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(-90deg) translateZ(160px); } to { -webkit-transform: scale3d(0.835,0.835,0.835) rotateY(0deg) translateZ(160px); } } .dj_iphone.dj_landscape .mblCube.mblOut.mblReverse { -webkit-animation-name: mblCubeOutReverse_iphone_l; -webkit-transform-origin: 50% 50% !important; } .dj_iphone.dj_landscape .mblCube.mblIn.mblReverse { -webkit-animation-name: mblCubeInReverse_iphone_l; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOutReverse_iphone_l { from { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(0deg) translateZ(240px); } to { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(90deg) translateZ(240px); } } @-webkit-keyframes mblCubeInReverse_iphone_l { from { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(-90deg) translateZ(240px); } to { -webkit-transform: scale3d(0.77,0.77,0.77) rotateY(0deg) translateZ(240px); } } .dj_ipad.dj_iphone .mblCube.mblOut { -webkit-animation-name: mblCubeOut_ipad; -webkit-transform-origin: 50% 50% !important; } .dj_ipad.dj_iphone .mblCube.mblIn { -webkit-animation-name: mblCubeIn_ipad; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOut_ipad { from { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(0deg) translateZ(384px); } to { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(-90deg) translateZ(384px); } } @-webkit-keyframes mblCubeIn_ipad { from { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(90deg) translateZ(384px); } to { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(0deg) translateZ(384px); } } .dj_ipad.dj_iphone.dj_landscape .mblCube.mblOut { -webkit-animation-name: mblCubeOut_ipad_l; -webkit-transform-origin: 50% 50% !important; } .dj_ipad.dj_iphone.dj_landscape .mblCube.mblIn { -webkit-animation-name: mblCubeIn_ipad_l; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOut_ipad_l { from { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(0deg) translateZ(512px); } to { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(-90deg) translateZ(512px); } } @-webkit-keyframes mblCubeIn_ipad_l { from { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(90deg) translateZ(512px); } to { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(0deg) translateZ(512px); } } .dj_ipad.dj_iphone .mblCube.mblOut.mblReverse { -webkit-animation-name: mblCubeOutReverse_ipad; -webkit-transform-origin: 50% 50% !important; } .dj_ipad.dj_iphone .mblCube.mblIn.mblReverse { -webkit-animation-name: mblCubeInReverse_ipad; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOutReverse_ipad { from { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(0deg) translateZ(384px); } to { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(90deg) translateZ(384px); } } @-webkit-keyframes mblCubeInReverse_ipad { from { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(-90deg) translateZ(384px); } to { -webkit-transform: scale3d(0.806,0.806,0.806) rotateY(0deg) translateZ(384px); } } .dj_ipad.dj_iphone.dj_landscape .mblCube.mblOut.mblReverse { -webkit-animation-name: mblCubeOutReverse_ipad_l; -webkit-transform-origin: 50% 50% !important; } .dj_ipad.dj_iphone.dj_landscape .mblCube.mblIn.mblReverse { -webkit-animation-name: mblCubeInReverse_ipad_l; -webkit-transform-origin: 50% 50% !important; } @-webkit-keyframes mblCubeOutReverse_ipad_l { from { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(0deg) translateZ(512px); } to { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(90deg) translateZ(512px); } } @-webkit-keyframes mblCubeInReverse_ipad_l { from { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(-90deg) translateZ(512px); } to { -webkit-transform: scale3d(0.758,0.758,0.758) rotateY(0deg) translateZ(512px); } } .mblReveal { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblReveal.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblReveal.mblOut { -webkit-transform: translate3d(0%,0px,0px) !important; } .mblReveal.mblOut.mblTransition { -webkit-transform: translate3d(-100%,0px,0px) !important; } .mblReveal.mblOut.mblReverse.mblTransition { -webkit-transform: translate3d(100%,0px,0px) !important; } .mblReveal.mblIn { z-index: -100; -webkit-transform: translate3d(0%,0px,-1px) !important; } .mblReveal.mblIn.mblTransition { -webkit-transform: translate3d(0%,0px,0px) !important; } .dj_android.dj_tablet .mblReveal.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblSlidev { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblSlidev.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .3s; } .mblSlidev.mblOut.mblReverse.mblTransition, .mblSlidev.mblIn { -webkit-transform: translate3d(0px,100%,0px) !important; } .mblSlidev.mblOut.mblTransition, .mblSlidev.mblIn.mblReverse { -webkit-transform: translate3d(0px,-100%,0px) !important; } .mblSlidev.mblOut, .mblSlidev.mblIn.mblTransition { -webkit-transform: translate3d(0px,0%,0px) !important; } .dj_android.dj_tablet .mblSlidev.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblCoverv { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblCoverv.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblCoverv.mblOut { z-index: -100; -webkit-transform: translate3d(0px,0%,-1px) !important; } .mblCoverv.mblIn { -webkit-transform: translate3d(0px,100%,0px) !important; } .mblCoverv.mblIn.mblReverse { -webkit-transform: translate3d(0px,-100%,0px) !important; } .mblCoverv.mblOut.mblTransition, .mblCoverv.mblIn.mblTransition { -webkit-transform: translate3d(0px,0%,0px) !important; } .dj_android.dj_tablet .mblCoverv.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblRevealv { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblRevealv.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblRevealv.mblOut { -webkit-transform: translate3d(0px,0%,0px) !important; } .mblRevealv.mblOut.mblTransition { -webkit-transform: translate3d(0px,-100%,0px) !important; } .mblRevealv.mblOut.mblReverse.mblTransition { -webkit-transform: translate3d(0px,100%,0px) !important; } .mblRevealv.mblIn { z-index: -100; -webkit-transform: translate3d(0px,0%,-1px) !important; } .mblRevealv.mblIn.mblTransition { -webkit-transform: translate3d(0px,0%,0px) !important; } .dj_android.dj_tablet .mblRevealv.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblSwirl.mblOut { -webkit-animation-duration: .5s; -webkit-animation-name: mblSwirlOut; -webkit-animation-timing-function: ease-in; } .mblSwirl.mblIn { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblSwirlIn; -webkit-animation-timing-function: ease-in; } .mblSwirl.mblOut.mblReverse { -webkit-animation-name: mblSwirlOutReverse; } @-webkit-keyframes mblSwirlOut { from { -webkit-transform: rotate(0deg) scale(1.0); } to { -webkit-transform: rotate(-360deg) scale(0.0); } } @-webkit-keyframes mblSwirlOutReverse { from { -webkit-transform: rotate(0deg) scale(1.0); } to { -webkit-transform: rotate(360deg) scale(0.0); } } @-webkit-keyframes mblSwirlIn { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } } .mblScaleOut.mblOut { -webkit-animation-duration: .5s; -webkit-animation-name: mblScaleOutOut; -webkit-animation-timing-function: ease-in; } .dj_android .mblScaleOut.mblOut { -webkit-animation-name: mblScaleOutOutAndroid; } .mblScaleOut.mblIn { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblScaleOutIn; -webkit-animation-timing-function: ease-in; } @-webkit-keyframes mblScaleOutOut { from { -webkit-transform: scale(1.0); opacity: 1; } to { -webkit-transform: scale(0.0); opacity: 0; } } @-webkit-keyframes mblScaleOutOutAndroid { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(0.0); } } @-webkit-keyframes mblScaleOutIn { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } } .mblScaleIn.mblOut { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblScaleInOut; -webkit-animation-timing-function: ease-out; } .mblScaleIn.mblIn { -webkit-animation-duration: .5s; -webkit-animation-name: mblScaleInIn; -webkit-animation-timing-function: ease-out; } .dj_android .mblScaleIn.mblIn { -webkit-animation-name: mblScaleInInAndroid; } @-webkit-keyframes mblScaleInOut { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } } @-webkit-keyframes mblScaleInIn { from { -webkit-transform: scale(0.0); opacity: 0; } to { -webkit-transform: scale(1.0); opacity: 1; } } @-webkit-keyframes mblScaleInInAndroid { from { -webkit-transform: scale(0.0); } to { -webkit-transform: scale(1.0); } } .mblSwap { -webkit-animation-duration: .6s; -webkit-animation-timing-function: linear; } .mblSwap.mblOut { -webkit-animation-name: mblSwapOut; } .mblSwap.mblIn { -webkit-animation-name: mblSwapIn; } .mblSwap.mblOut.mblReverse { -webkit-animation-name: mblSwapOutReverse; } .mblSwap.mblIn.mblReverse { -webkit-animation-name: mblSwapInReverse; } @-webkit-keyframes mblSwapOut { 0% { -webkit-transform: translate3d(0%,0%,0px) scale(1.0); opacity: 1; } 50% { z-index: -60; -webkit-transform: translate3d(-45%,5%,0px) scale(.6); opacity: .4; } 100% { z-index: -100; -webkit-transform: translate3d(-20%,10%,0px) scale(.4); opacity: 0; } } @-webkit-keyframes mblSwapIn { 0% { z-index: -100; -webkit-transform: translate3d(-20%,0%,0px) scale(.5); opacity: .4; } 50% { z-index: -40; -webkit-transform: translate3d(45%,0%,0px) scale(.7); opacity: 1; } 100% { -webkit-transform: translate3d(0%,0%,0px) scale(1.0); opacity: 1; } } @-webkit-keyframes mblSwapOutReverse { 0% { -webkit-transform: translate3d(0%,0%,0px) scale(1.0); opacity: 1; } 50% { z-index: -60; -webkit-transform: translate3d(45%,5%,0px) scale(.6); opacity: .4; } 100% { z-index: -100; -webkit-transform: translate3d(20%,10%,0px) scale(.4); opacity: 0; } } @-webkit-keyframes mblSwapInReverse { 0% { z-index: -100; -webkit-transform: translate3d(20%,0%,0px) scale(.5); opacity: .4; } 50% { z-index: -40; -webkit-transform: translate3d(-45%,0%,0px) scale(.7); opacity: 1; } 100% { -webkit-transform: translate3d(0%,0%,0px) scale(1.0); opacity: 1; } } .mblZoomOut.mblOut { -webkit-animation-duration: .5s; -webkit-animation-name: mblZoomOutOut; -webkit-animation-timing-function: ease-in; } .dj_android .mblZoomOut.mblOut { -webkit-animation-name: mblZoomOutOutAndroid; } .mblZoomOut.mblIn { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblZoomOutIn; -webkit-animation-timing-function: ease-in; } @-webkit-keyframes mblZoomOutOut { from { -webkit-transform: scale(1.0); opacity: 1; } to { -webkit-transform: scale(0.0); opacity: 0; } } @-webkit-keyframes mblZoomOutOutAndroid { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(0.0); } } @-webkit-keyframes mblZoomOutIn { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } } .mblZoomIn.mblOut { z-index: -100; -webkit-animation-duration: .5s; -webkit-animation-name: mblZoomInOut; -webkit-animation-timing-function: ease-out; } .mblZoomIn.mblIn { -webkit-animation-duration: .5s; -webkit-animation-name: mblZoomInIn; -webkit-animation-timing-function: ease-out; } .dj_android .mblZoomIn.mblIn { -webkit-animation-name: mblZoomInInAndroid; } @-webkit-keyframes mblZoomInOut { from { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(1.0); } } @-webkit-keyframes mblZoomInIn { from { -webkit-transform: scale(0.0); opacity: 0; } to { -webkit-transform: scale(1.0); opacity: 1; } } @-webkit-keyframes mblZoomInInAndroid { from { -webkit-transform: scale(0.0); } to { -webkit-transform: scale(1.0); } } .mblAccordion { border-style: outset; border-width: 1px; border-color: #8c8f91; } .mblAccordionRoundRect { margin: 7px 9px 16px 9px; padding: 0; border: 1px solid #adaaad; border-radius: 8px; } .mblAccordionRoundRect .mblAccordionTitle:first-child { border-top-left-radius: 8px; border-top-right-radius: 8px; } .mblAccordionRoundRect .mblAccordionTitleLast, .mblAccordionRoundRect .mblAccordionPane:last-child { border-bottom-width: 0; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } .mblAccordionTitle { position: relative; height: 30px; width: 100%; font-family: Helvetica; font-size: 17px; font-weight: bold; line-height: 30px; vertical-align: middle; white-space: nowrap; border-top: 1px solid #8c8f91; background-image: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#e1e5e8), color-stop(0.2, #f0f2f3)); } .mblAccordionTitle:first-child { border-top: none; } .mblAccordionTitleAnchor { display: block; height: 100%; text-decoration: none; white-space: nowrap; color: black; } .mblAccordionIconParent { float: left; margin: 6px 4px 0 6px; line-height: normal; } .mblAccordionIconParent1 { display: block; } .mblAccordionIconParent2 { display: none; } .mblAccordionTitleSelected { border-bottom: 1px solid #8c8f91; background-image: -webkit-gradient(linear, left top, left bottom, from(#97afc0), to(#46708e), color-stop(0.2, #7796ac)); color: white; } .mblAccordionTitleSelected .mblAccordionTitleAnchor { color: white; } .mblAccordionTitleSelected .mblAccordionIconParent1 { display: none; } .mblAccordionTitleSelected .mblAccordionIconParent2 { display: block; } .mblButton { padding: 0 10px; height: 29px; border-style: outset; border-width: 1px; background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cecece), color-stop(0.5, #f8f8f8), color-stop(0.5, #eeeeee)); font-family: Helvetica; line-height: 29px; cursor: pointer; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); border-color: #9cacc0; border-radius: 5px; color: black; font-size: 13px; } .mblButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#bfbfbf), color-stop(0.5, #ebebeb), color-stop(0.5, #dedede)); color: black; } .mblButtonDisabled, .mblButton:disabled { border-color: grey; background-image: none; color: grey; cursor: default; } .mblBlueButton { background-image: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); color: white; } .mblBlueButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblRedButton { background-image: -webkit-gradient(linear, left top, left bottom, from(#fa9d58), to(#ee4115), color-stop(0.5, #ff4d25), color-stop(0.5, #ed4d15)); color: white; } .mblRedButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#c1a48e), to(#9b6c4a), color-stop(0.5, #a27758), color-stop(0.5, #996947)); } .mblCarousel { overflow: hidden; height: 300px; } .mblCarouselSlot { position: relative; float: left; text-align: left; box-sizing: border-box; } .mblCarouselHeaderBar { background-color: #3a3a3b; color: #b1b1b1; font: bold 16px arial, helvetica, clean, sans-serif; padding: 1px; } .mblCarouselBtnContainer { float: right; } .mblCarouselBtn { height: 18px; width: 46px; font: bold 14px arial, helvetica, clean, sans-serif; color: gray; padding-top: 0px; margin: 0px 2px; border-width: 1px; } .mblCarouselTitle { margin: 2px 0px 2px 4px; } .mblCarouselHeaderBar .mblPageIndicator { float: right; width: auto; padding: 0px 20px; } .mblCarouselHeaderBar .mblPageIndicatorContainer { margin-left: 0px; margin-right: 0px; } .mblCarouselPages { position: relative; text-align: center; } .mblCarouselItem { text-align: center; } .mblCarouselItemHeaderText { color: white; font: 14px arial, helvetica, clean, sans-serif; text-align: center; margin-top: 8px; margin-bottom: 5px; } .mblCarouselItemFooterText { color: white; font: 14px arial, helvetica, clean, sans-serif; text-align: center; margin-top: 5px; margin-bottom: 8px; } .mblCarouselItemImage { -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); vertical-align: bottom; } .mblCarouselItemBlank { display: none; } .mblCarouselSlotSelected .mblCarouselItemImage { opacity: 0.6; -webkit-box-shadow: none; } .mblCheckBox { position: relative; margin: -0.5em 3px 0.3em 4px; width: 1em; height: 1em; border-style: outset; border-width: 1px; background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cecece), color-stop(0.5, #f8f8f8), color-stop(0.5, #eeeeee)); font: inherit; cursor: pointer; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-transform: translatey(0.45em); border-color: #9cacc0; border-radius: 5px; } .mblCheckBoxSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#bfbfbf), color-stop(0.5, #ebebeb), color-stop(0.5, #dedede)); } .mblCheckBoxChecked, .mblCheckBox:checked { background-image: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblCheckBoxChecked::after, .mblCheckBox:checked::after { position: absolute; content: ""; width: 0.3em; height: 0.6em; top: 0; left: 0.3em; border-width: 0.15em; border-style: none solid solid none; -webkit-transform: rotate(45deg); -webkit-transform-origin: 50% 50%; border-color: white; } .mblCheckBoxChecked.mblCheckBoxSelected, .mblCheckBox:checked.mblCheckBoxSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .dijitPopup { margin: 0; padding: 0; position: absolute; border: 0; background-color: transparent; -webkit-box-shadow: 0 0 50px black; border-radius: 0; } .mblReset { margin: 0; padding: 0; border: 0; line-height: normal; font: inherit; color: inherit; } .mblComboBoxMenu { position: relative; overflow-y: hidden !important; overflow: hidden; border: 1px solid black; border-radius: 0; background-color: white; } .mblComboBoxMenuItem { padding: .1em .2em; border-width: 1px 0 1px 0; border-style: solid; text-align: left; white-space: nowrap; border-color: #ffffff; color: inherit; } .mblComboBoxMenuItemSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#048bf4), to(#005ce5)); color: white; } .mblComboBoxMenuPreviousButton, .mblComboBoxMenuNextButton { font-style: italic; overflow: hidden; } .mblFixedSplitter { width: 100%; height: 100%; } .mblFixedSplitter > * { position: absolute; overflow-x: hidden; overflow-y: auto; } .mblFixedSplitterH > * { height: 100%; top: 0px; } .mblFixedSplitterV > * { width: 100%; left: 0px; } .mblGridLayout { width: 100%; height: 100%; padding: 0; } .mblGridLayout > div { margin: 0; border: 0; padding: 0; float: left; min-height: 1px; } .mblGridItemFirstColumn { clear: left; } .mblGridItemTerminator { clear: both; } .mblGridItemLastItem:after { content: ""; display: block; clear: both; } .mblDomButtonBlueMinus, .mblDomButtonBluePlus, .mblDomButtonDarkBlueMinus, .mblDomButtonDarkBluePlus, .mblDomButtonRedMinus, .mblDomButtonRedPlus { position: relative; width: 29px; height: 29px; } .mblDomButtonBlueMinus > div, .mblDomButtonBluePlus > div, .mblDomButtonDarkBlueMinus > div, .mblDomButtonDarkBluePlus > div, .mblDomButtonRedMinus > div, .mblDomButtonRedPlus > div { position: relative; top: 4px; left: 3px; width: 22px; height: 18px; border-width: 1px 1px 1px 0px; border-style: outset; color: white; border-radius: 3px; } .mblDomButtonBlueMinus > div, .mblDomButtonBluePlus > div { border-color: #6d89c7; background-color: #366edf; background: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblDomButtonDarkBlueMinus > div, .mblDomButtonDarkBluePlus > div { border-color: #6d89c7; background-color: #5877a2; background: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblDomButtonRedMinus > div, .mblDomButtonRedPlus > div { border-color: #cc1122; background-color: #c9404b; background: -webkit-gradient(linear, left top, left bottom, from(#d3656d), to(#bc1320), color-stop(0.5, #c9404b), color-stop(0.5, #bc1421)); } .mblDomButtonBlueMinus > div > div, .mblDomButtonBluePlus > div > div, .mblDomButtonDarkBlueMinus > div > div, .mblDomButtonDarkBluePlus > div > div, .mblDomButtonRedMinus > div > div, .mblDomButtonRedPlus > div > div { position: absolute; top: 7px; left: 7px; width: 8px; height: 2px; margin: 0px; font-size: 1px; border-style: none; background: white; border-top: 1px solid #4a5a71; } .mblDomButtonBluePlus > div > div > div, .mblDomButtonDarkBluePlus > div > div > div, .mblDomButtonRedPlus > div > div > div { position: absolute; top: -3px; left: 3px; width: 2px; height: 8px; margin: 0px; font-size: 1px; background-color: white; } .mblDomButtonBlackCircleCross { position: relative; width: 29px; height: 29px; } .mblDomButtonBlackCircleCross > div { position: relative; top: 3px; left: 3px; width: 23px; height: 23px; background-color: white; border-radius: 12px; -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5); } .mblDomButtonBlackCircleCross > div > div { position: relative; top: 2px; left: 2px; width: 19px; height: 19px; background-color: black; border-radius: 10px; } .mblDomButtonBlackCircleCross > div > div > div { position: absolute; top: 8px; left: 3px; width: 13px; height: 3px; margin: 0px; font-size: 1px; border-style: none; background-color: white; -webkit-transform: rotate(45deg); border-radius: 1px; } .mblDomButtonBlackCircleCross > div > div > div > div { position: absolute; top: -5px; left: 5px; width: 3px; height: 13px; margin: 0px; font-size: 1px; background-color: white; border-radius: 1px; } @-webkit-keyframes mblVibrate{ 0%{ -webkit-transform: rotate(-2deg); bottom: -1px; left: -1px; } 25% { -webkit-transform: rotate(1deg); bottom: 2px; left: 1px; } 50% { -webkit-transform: rotate(-1deg); bottom: -2px; left: -1px; } 75% { -webkit-transform: rotate(2deg); bottom: 2px; left: 1px; } 100% { -webkit-transform: rotate(-2deg); bottom: -1px; left: -1px; } } @-webkit-keyframes mblShrink{ from { -webkit-transform: scale(1); } to { -webkit-transform: scale(0.01); } } @-webkit-keyframes mblShrink0{ from { -webkit-transform: scale(1); } to { -webkit-transform: translate(-40%,-70%) scale(0.01); } } @-webkit-keyframes mblShrink1{ from { -webkit-transform: scale(1); } to { -webkit-transform: translate(-14%,-70%) scale(0.01); } } @-webkit-keyframes mblShrink2{ from { -webkit-transform: scale(1); } to { -webkit-transform: translate(14%,-70%) scale(0.01); } } @-webkit-keyframes mblShrink3{ from { -webkit-transform: scale(1); } to { -webkit-transform: translate(40%,-70%) scale(0.01); } } .mblIconContainer { margin: 20px 10px; padding: 0; } .mblIconItem { position: relative; overflow: hidden; list-style-type: none; float: left; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .mblIconItemTerminator { list-style-type: none; clear: both; } .mblIconItemPane { list-style-type: none; background-color: white; } .mblIconArea { position: relative; height: 78px; font-family: Helvetica; font-size: 12px; text-align: center; margin-top: 5px; margin-bottom: 5px; width: 74px; } .mblIconArea img { vertical-align: middle; } .mblIconAreaInner { position: relative; height: 65px; line-height: 65px; text-align: center; } .mblIconItemDeleteIcon { position: absolute; top: -4px; left: -2px; } .mblIconItemSpriteIcon { position: absolute; } .mblContent { clear: both; padding-bottom: 20px; } table.mblClose { clear: both; cursor: pointer; } .mblVibrate { position: relative; -webkit-animation-duration: .5s; -webkit-animation-timing-function: ease-in-out; -webkit-animation-iteration-count: infinite; -webkit-animation-name: mblVibrate; -webkit-transform: rotate(0deg); } .mblCloseContent { -webkit-animation-duration: .3s; -webkit-animation-timing-function: ease-in-out; -webkit-animation-name: mblShrink; -webkit-transform: scale(0.01); } .mblCloseContent.mblShrink0 { -webkit-animation-name: mblShrink0; } .mblCloseContent.mblShrink1 { -webkit-animation-name: mblShrink1; } .mblCloseContent.mblShrink2 { -webkit-animation-name: mblShrink2; } .mblCloseContent.mblShrink3 { -webkit-animation-name: mblShrink3; } .mblIconItemPaneHeading { position: relative; clear: both; overflow: hidden; margin-top: 0px; padding-left: 40px; height: 25px; border-top: 1px solid #f1f3f4; border-bottom: 1px solid #717d85; background-image: -webkit-gradient(linear, left top, left bottom, from(#e0e4e7), to(#b4bec6), color-stop(0.5, #c4ccd2), color-stop(0.5, #bfc8ce)); font-family: Helvetica; font-size: 14px; color: white; line-height: 26px; text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0px; text-overflow: ellipsis; white-space: nowrap; } .mblIconItemPaneIcon { position: absolute; top: -2px; left: 1px; } .mblIconMenu { width: 100%; height: 100%; border-radius: 10px; text-align: center; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); padding: 0; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(102, 102, 119, 0.85)), to(rgba(4, 4, 4, 0.85)), color-stop(0.35, rgba(22, 22, 30, 0.85))); border: 2px solid #9a9a9e; border-top-color: #f2f2f3; -webkit-box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.5); } .mblIconMenuItem { float: left; list-style-type: none; -webkit-box-sizing: border-box; border-left: 1px solid #6b6c6f; border-bottom: 1px solid #6b6c6f; } .mblIconMenuItemIcon { position: relative; margin-left: auto; margin-right: auto; } .mblIconMenuItemFirstColumn { border-left: none; } .mblIconMenuItemLastRow { border-bottom: none; } .mblIconMenuItemFirstRow.mblIconMenuItemFirstColumn { border-top-left-radius: 10px; } .mblIconMenuItemFirstRow.mblIconMenuItemLastColumn { border-top-right-radius: 10px; } .mblIconMenuItemLastRow.mblIconMenuItemFirstColumn { border-bottom-left-radius: 10px; } .mblIconMenuItemLastRow.mblIconMenuItemLastColumn { border-bottom-right-radius: 10px; } .mblIconMenuItemAnchor { display: block; height: 100%; font-family: Helvetica; text-decoration: none; font-size: 11px; color: #b8bbc0; } .mblIconMenuItemTable { width: 100%; height: 100%; } .mblIconMenuItemTable img { border: none; } .mblIconMenuItemSel { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(139, 157, 229, 0.6)), to(rgba(10, 54, 233, 0.8)), color-stop(0.6, rgba(10, 54, 233, 0.8))); } .mblCoverv { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblCoverv.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblCoverv.mblOut { z-index: -100; -webkit-transform: translate3d(0px,0%,-1px) !important; } .mblCoverv.mblIn { -webkit-transform: translate3d(0px,100%,0px) !important; } .mblCoverv.mblIn.mblReverse { -webkit-transform: translate3d(0px,-100%,0px) !important; } .mblCoverv.mblOut.mblTransition, .mblCoverv.mblIn.mblTransition { -webkit-transform: translate3d(0px,0%,0px) !important; } .dj_android.dj_tablet .mblCoverv.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblRevealv { -webkit-transition-property: none; -webkit-transition-duration: 0s; } .mblRevealv.mblTransition { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: .4s; } .mblRevealv.mblOut { -webkit-transform: translate3d(0px,0%,0px) !important; } .mblRevealv.mblOut.mblTransition { -webkit-transform: translate3d(0px,-100%,0px) !important; } .mblRevealv.mblOut.mblReverse.mblTransition { -webkit-transform: translate3d(0px,100%,0px) !important; } .mblRevealv.mblIn { z-index: -100; -webkit-transform: translate3d(0px,0%,-1px) !important; } .mblRevealv.mblIn.mblTransition { -webkit-transform: translate3d(0px,0%,0px) !important; } .dj_android.dj_tablet .mblRevealv.mblTransition { -webkit-transition-duration: .6s; -webkit-transition-timing-function: linear; } .mblOverlay { position: fixed; z-index: 2000; left: 0; bottom: 0; margin: 0; width: 100%; text-align: -webkit-center; background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cecece)); } .mblOverlayHidden *, .mblOverlayHidden { visibility: hidden !important; } .mblTooltip { position: absolute; z-index: 2000; display: block; margin: 0; padding: 5px; border-width: 1px; border-style: solid; opacity: .97; border-color: #5a5a5a; border-radius: 8px; background-color: #121b2f; background-image: -webkit-gradient(linear, left top, left bottom, from(#656872), to(#121b2f), color-stop(0.1, #2c3345), color-stop(0.1, #161f32)); } .mblTooltipBubble { overflow: visible; padding: 3px; background-color: #f9f7ba; background-image: none; } .mblTooltipBubble.mblTooltipAbove .mblTooltipInnerArrow { border-bottom-color: #f9f7ba; } .mblTooltipBubble.mblTooltipBelow .mblTooltipInnerArrow { border-top-color: #f9f7ba; } .mblTooltipBubble.mblTooltipAfter .mblTooltipInnerArrow { border-left-color: #f9f7ba; } .mblTooltipBubble.mblTooltipBefore .mblTooltipInnerArrow { border-right-color: #f9f7ba; } .mblTooltip.mblTooltipAfter { margin-left: -11px; } .mblTooltip.mblTooltipBefore { margin-left: 11px; } .mblTooltip.mblTooltipAbove { margin-top: 11px; } .mblTooltip.mblTooltipBelow { margin-top: -11px; } .mblTooltipAnchor { position: absolute; width: 1px; height: 1px; background-color: transparent; line-height: 0; font-size: 0; } .mblTooltipBefore .mblTooltipAnchor { left: -1px; } .mblTooltipAfter .mblTooltipAnchor { right: -1px; } .mblTooltipAbove .mblTooltipAnchor { top: -1px; } .mblTooltipBelow .mblTooltipAnchor { bottom: -1px; } .mblTooltipArrow { position: absolute; width: 0; height: 0; line-height: 0; border: 11px solid transparent; } .mblTooltipBefore .mblTooltipArrow { left: auto; right: 1px; top: 0; bottom: auto; border-left-width: 0; border-right-color: #5a5a5a; } .mblTooltipAfter .mblTooltipArrow { left: 1px; right: auto; top: 0; bottom: auto; border-right-width: 0; border-left-color: #5a5a5a; } .mblTooltipAbove .mblTooltipArrow { top: auto; bottom: 1px; left: auto; right: auto; border-top-width: 0; border-bottom-color: #5a5a5a; } .mblTooltipBelow .mblTooltipArrow { top: 1px; bottom: auto; left: auto; right: auto; border-bottom-width: 0; border-top-color: #5a5a5a; } .mblTooltipInnerArrow { position: absolute; width: 0; height: 0; line-height: 0; border: 10px solid transparent; } .mblTooltipBefore .mblTooltipInnerArrow { right: 0; top: 0; border-left-width: 0; border-right-color: #192235; } .mblTooltipAfter .mblTooltipInnerArrow { left: 0; top: 0; border-right-width: 0; border-left-color: #192235; } .mblTooltipAbove .mblTooltipInnerArrow { bottom: 0; left: 0; border-top-width: 0; border-bottom-color: #656872; } .mblTooltipBelow .mblTooltipInnerArrow { top: 0; left: 0; border-bottom-width: 0; border-top-color: #172035; } .mblTooltipHidden, .mblTooltipHidden * { visibility: hidden !important; } .mblTooltipHidden { top: -99999px !important; left: -99999px !important; } .mblTooltip .mblHeading { border-top: 3px solid #4f5055; border-bottom: 1px solid #2d3642; border-left: 1px solid #2a2d47; border-radius: 3px 3px 0 0; background-color: #889bb3; background-image: -webkit-gradient(linear, left top, left bottom, from(#5e6167), to(#1a1d24), color-stop(0.5, #2e322b)); font-weight: normal; } .mblTooltip .mblHeading .mblToolBarButton { border: 1px inset #434450; background-image: -webkit-gradient(linear, left top, left bottom, from(#686f80), to(#000924), color-stop(0.5, #000b29)); font-weight: normal; } .mblPageIndicator { position: relative; width: 100%; height: 20px; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .mblPageIndicatorContainer { margin-top: 4px; margin-left: auto; margin-right: auto; } .mblPageIndicatorDot { margin: 0px 3px; width: 6px; height: 6px; font-size: 1px; background-color: #949294; border-radius: 3px; } .mblPageIndicatorDotSelected { background-color: white; } .mblProgressBar { position: relative; border-radius: 6px; height: 9px; background-image: -webkit-gradient(linear, left top, left bottom, from(#a5a6a5), to(#b5b6b5), color-stop(0.5, #d6d7d6), color-stop(0.5, #ffffff), color-stop(0.9, #ffffff)); } .mblProgressBarProgress { -webkit-transition-property: width; -webkit-transition-duration: 0.25s; height: 7px; border: 1px solid #5e6fa3; border-radius: 6px; background-image: -webkit-gradient(linear, left top, left bottom, from(#b0c0ff), to(#2f83e1), color-stop(0.6, #70b2ff), color-stop(0.6, #3470b6)); } .mblProgressBarNotStarted { border-left: none; border-right: none; } .mblProgressBarMsg { position: absolute; top: 0px; width: 100%; height: 100%; text-align: center; font-size: 12px; top: -1px; font-size: 10px; } .mblRadioButton { position: relative; margin: -0.5em 3px 0.3em 4px; width: 1em; height: 1em; border-style: outset; border-width: 1px; border-radius: 0.5em; background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cecece), color-stop(0.5, #f8f8f8), color-stop(0.5, #eeeeee)); font: inherit; cursor: pointer; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-transform: translatey(0.45em); border-color: #9cacc0; } .mblRadioButtonChecked, .mblRadioButton:checked { background-image: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); } .mblRadioButtonChecked::after, .mblRadioButton:checked::after { position: absolute; content: ""; width: 0.3em; height: 0.6em; top: 0; left: 0.25em; border-width: 0.15em; border-style: none solid solid none; -webkit-transform: rotate(45deg); -webkit-transform-origin: 50% 50%; border-color: white; } .mblRadioButtonChecked.mblRadioButtonSelected, .mblRadioButton:checked.mblRadioButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblRadioButtonChecked.mblRadioButtonSelected::after, .mblRadioButton:checked.mblRadioButtonSelected::after { border-color: white; } .mblScrollablePane { position: relative; overflow: hidden; } .mblScrollableViewContainer { position: absolute; top: 0px; } .mblScrollablePaneMask { position: relative; } .mblSimpleDialog { position: absolute; z-index: 100; margin: 0; text-align: center; outline: none; padding: 5px; width: 262px; } .mblSimpleDialogDecoration { border-radius: 10px; background-color: rgba(35, 50, 96, 0.85); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(150, 150, 170, 0.85)), to(rgba(18, 29, 68, 0.85)), color-stop(0.15, rgba(77, 85, 119, 0.85)), color-stop(0.15, rgba(35, 50, 96, 0.85))); border: 2px solid #bac1d3; border-top-color: #eaeaf2; -webkit-box-shadow: 0 3px 2px #000000; color: white; } .mblSimpleDialogContainer { position: relative; width: 100%; height: 100%; } .mblSimpleDialogCover { background-color: #000000; opacity: 0.5; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; } .mblSimpleDialogCloseBtn { position: absolute !important; } .mblSimpleDialogTitle { margin: 14px 0 7px; width: 262px; font-weight: bold; } .mblSimpleDialogText { margin: 7px 0 14px; width: 262px; } .mblSlider { margin: 15px; border-style: inset; border-width: 1px; border-radius: 8px; background-image: -webkit-gradient(linear, left top, left bottom, from(#cecece), to(#fdfdfd), color-stop(0.5, #eeeeee), color-stop(0.5, #f8f8f8)); -webkit-user-select: none; -webkit-box-sizing: content-box; border-color: #b0b0b0; } .mblSliderH { width: 200px; height: 8px; } .mblSliderH .mblSliderProgressBar { height: 100%; } .mblSliderH .mblSliderHandle { top: 50%; } .mblSliderV { height: 200px; width: 8px; } .mblSliderV .mblSliderProgressBar { width: 100%; } .mblSliderV .mblSliderHandle { left: 50%; } .mblSliderProgressBar { border-radius: 8px; background-image: -webkit-gradient(linear, left top, left bottom, from(#2859b1), to(#75acfb), color-stop(0.5, #3f84eb), color-stop(0.5, #4c8eee)); } .mblSliderHandle { margin: -10px 0 0 -10px; width: 18px; height: 18px; border-style: outset; border-width: 1px; border-radius: 10px; background-image: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#fafafa)); border-color: #9d9d9d; } .mblSliderTransition { -webkit-transition-duration: 400ms; } .mblSliderTouchBox { margin: 0; padding: 12pt; left: -12pt; top: -12pt; border: none; width: 100%; height: 100%; background-color: transparent; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .mblSpinWheel { position: relative; overflow: hidden; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #313137), color-stop(0.05, #73747d), color-stop(0.07, #92939b), color-stop(0.09, #ababb5), color-stop(0.12, #c5c6ce), color-stop(0.16, #dfe0e4), color-stop(0.22, #f4f5f6), color-stop(0.35, #fbfcfc), color-stop(0.5, #fbfcfc), color-stop(0.61, #fbfcfc), color-stop(0.61, #b4c1c7), color-stop(0.65, #fbfcfc), color-stop(0.78, #f4f5f6), color-stop(0.84, #dfe0e4), color-stop(0.88, #c5c6ce), color-stop(0.91, #ababb5), color-stop(0.93, #92939b), color-stop(0.95, #73747d), color-stop(1, #313137)); height: 200px; border-left: solid 3px #000000; border-right: solid 3px #000000; color: #000000; border-radius: 3px; } .mblSpinWheelBar { position: absolute; top: 79px; background: -webkit-gradient(linear, left top, left bottom, from(#edeef2), to(#a7adca), color-stop(0, #edeef2), color-stop(0.25, #c8cadd), color-stop(0.49, #bbbfd4), color-stop(0.51, #9fa8c6), color-stop(0.81, #a2a9c7), color-stop(0.82, #a6abc9), color-stop(1, #a7adca)); border: solid 1px #7b8497; height: 42px; width: 100%; clear: both; opacity: 0.6; } .mblSpinWheelDatePicker { width: 312px; } .mblSpinWheelTimePicker { width: 98px; } .mblSpinWheelSlot { position: relative; top: 0px; float: left; width: 100px; height: 100%; border-left: solid 2px #000000; border-right: solid 2px #000000; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } .mblSpinWheelSlotLabel { padding: 0 8px; height: 44px; overflow: hidden; font: bold 24px/44px Helvetica, sans-serif; } .mblSpinWheelSlotLabel img { vertical-align: middle; opacity: 0.7; } .mblSpinWheelSlotLabelGray { color: #cccccc; } .mblSpinWheelSlotLabelBlue { color: #0959d2; } .mblSpinWheelSlotContainer { position: relative; } .mblSpinWheelSlotPanel { position: absolute; top: 0px; width: 100%; } .mblSpinWheelSlotTouch { position: absolute; top: 0px; width: 100%; height: 100%; z-index: 1; } .mblDomButtonWhiteCross { position: relative; width: 29px; height: 29px; } .mblDomButtonWhiteCross > div { position: absolute; top: 12px; left: 7px; width: 14px; height: 2px; margin: 0px; font-size: 1px; border: 1px solid #808080; background-color: #ffffff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); border-radius: 2px; } .mblDomButtonWhiteCross > div > div { position: absolute; top: -7px; left: 5px; width: 2px; height: 14px; margin: 0px; font-size: 1px; border: 1px solid #808080; background-color: #ffffff; border-radius: 2px; } .mblTabBar { position: relative; margin: 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0px 6px; height: 42px; text-align: center; color: white; border-top: 1px solid #cdd5df; border-bottom: 1px solid #2d3642; text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0; } .mblTabBarButton { overflow: hidden; cursor: pointer; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); position: relative; list-style-type: none; float: left; } .mblTabBarButtonIconArea { margin: 0 auto; width: 29px; } .mblTabBarButtonIconParent1 { display: block; } .mblTabBarButtonIconParent2 { display: none; } .mblTabBarButtonSelected .mblTabBarButtonIconParent1 { display: none; } .mblTabBarButtonSelected .mblTabBarButtonIconParent2 { display: block; } .mblTabBarTabBar { height: 48px; border-top: 1px solid #000000; background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); } .mblTabBarTabBar .mblTabBarButtonIconArea { padding-top: 4px; } .mblTabBarTabBar .mblTabBarButtonLabel { font-family: "Helvetica Neue", Helvetica; font-size: 11px; color: #979797; } .mblTabBarTabBar .mblTabBarButtonSelected { border-radius: 3px; background-color: #404040; background-image: -webkit-gradient(linear, left top, left bottom, from(#484848), to(#242424), color-stop(0.5, #353535), color-stop(0.5, #242424)); } .mblTabBarTabBar .mblTabBarButtonSelected .mblTabBarButtonLabel { color: white; } .mblTabBarSegmentedControl { background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); } .mblTabBarSegmentedControl.mblTabBarNoText .mblTabBarButton { width: auto; padding: 0 3px; } .mblTabBarSegmentedControl.mblTabBarNoText .mblTabBarButtonIconArea { position: relative; } .mblTabBarSegmentedControl .mblTabBarButton { margin: 6px 0; width: 100px; height: 29px; border-width: 1px 1px 1px 0px; font-family: Helvetica; font-size: 13px; font-weight: bold; text-align: center; line-height: 29px; border-style: solid; border-color: #2f3740 #405a7e #375073 #3a4755; color: white; background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.305); } .mblTabBarSegmentedControl .mblTabBarButton:first-child { border-left-width: 1px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .mblTabBarSegmentedControl .mblTabBarButton:last-child { border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .mblTabBarSegmentedControl .mblTabBarButtonIconArea { position: absolute; top: 0px; left: 0px; } .mblTabBarSegmentedControl .mblTabBarButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#222222), color-stop(0.02, #8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblHeading .mblTabBarSegmentedControl { display: inline; float: left; height: auto; border: none; } .mblTabBarStandardTab { background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); } .mblTabBarStandardTab .mblTabBarButton { margin-top: 9px; padding: 9px; border: 1px solid #62676d; border-top-left-radius: 4px; border-top-right-radius: 4px; font-family: Helvetica; font-size: 14px; font-weight: bold; color: white; background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); } .mblTabBarStandardTab .mblTabBarButtonIconArea { position: absolute; top: 3px; left: 0px; } .mblTabBarStandardTab .mblTabBarButtonSelected { background-color: #5877a2; background-image: -webkit-gradient(linear, left top, left bottom, from(#222222), color-stop(0.02, #8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblTabBarStandardTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { margin-left: 20px; } .mblTabBarSlimTab { height: 30px; padding: 0px; border: 1px solid #2d3642; background-color: #000000; background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); } .mblTabBarSlimTab .mblTabBarButton { padding: 7px; border-right: 1px solid #4e4e4e; background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); font-family: Helvetica; font-size: 14px; font-weight: bold; color: white; text-shadow: rgba(100, 100, 100, 0.6) 0px -1px 0px; text-align: center; } .mblTabBarSlimTab .mblTabBarButton:first-child { border-left: 1px solid #4e4e4e; } .mblTabBarSlimTab .mblTabBarButtonIconArea { position: absolute; top: 0px; left: 0px; } .mblTabBarSlimTab .mblTabBarButtonSelected { background-color: #404040; background-image: -webkit-gradient(linear, left top, left bottom, from(#313031), to(#959595), color-stop(0.5, #5a555a), color-stop(0.5, #616161)); } .mblTabBarSlimTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { margin-left: 20px; } .mblTabBarFlatTab { height: 30px; padding: 0px; border-style: none; background-color: transparent; background-image: none; } .mblTabBarFlatTab .mblTabBarButton { padding: 7px; background-image: none; font-family: Helvetica; font-size: 14px; font-weight: bold; text-shadow: rgba(100, 100, 100, 0.6) 0px -1px 0px; text-align: center; } .mblTabBarFlatTab .mblTabBarButtonIconArea { position: absolute; top: 0px; left: 0px; } .mblTabBarFlatTab .mblTabBarButtonHasIcon .mblTabBarButtonLabel { margin-left: 20px; } .mblTabBarTallTab { height: 64px; border-top: 1px solid #cdd5df; border-bottom: 2px solid #949694; background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2d2d), to(#000000), color-stop(0.5, #141414), color-stop(0.5, #000000)); } .mblTabBarTallTab .mblTabBarButton { margin-top: 3px; margin-right: 2px; width: 78px; height: 61px; border-width: 0px 1px 0px 1px; border-style: solid; border-color: black #182018 black #393c39; background-image: -webkit-gradient(linear, left top, left bottom, from(#181818), to(#100c10), color-stop(0.1, #313031)); font-family: Helvetica; font-size: 13px; color: white; text-align: center; background-color: #212421; background-image: none; } .mblTabBarTallTab .mblTabBarButtonIconArea { margin-top: 8px; } .mblTabBarTallTab .mblTabBarButtonLabel { font-family: "Helvetica Neue", Helvetica; font-size: 11px; } .mblTabBarTallTab .mblTabBarButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#a59ea5), to(#848284)); background-color: #636363; background-image: none; } .mblTextArea { padding: 4px 1px; border-width: 1px; border-style: inset; font-family: Helvetica; font-size: 13px; border-color: #9cacc0; border-radius: 5px; } .mblExpandingTextArea { margin: 2px; } .mblTextBox { height: 22px; border-width: 1px; border-style: inset; font-family: Helvetica; font-size: 13px; border-color: #9cacc0; border-radius: 5px; } .mblSearchBox.iphone4:focus::-webkit-search-cancel-button { background: none !important; border-color: transparent !important; } .mblSearchBox::-webkit-search-cancel-button { -webkit-appearance: none; background-color: #b2b2b2; background-repeat: no-repeat; background-position: center center; background-size: 15px 15px; background-image: -webkit-gradient(linear, left top, right bottom, from(transparent), color-stop(0.46, transparent), color-stop(0.46, white), color-stop(0.54, white), color-stop(0.54, transparent), to(transparent)), -webkit-gradient(linear, right top, left bottom, from(transparent), color-stop(0.46, transparent), color-stop(0.46, white), color-stop(0.54, white), color-stop(0.54, transparent), to(transparent)) !important; border: 2px solid #b2b2b2; box-sizing: border-box; height: 15px; width: 15px; display: inline-block; vertical-align: middle; margin-left: 0.5em; border-radius: 1em; } .mblSearchBox::-webkit-search-results-decoration { -webkit-appearance: none; background-repeat: no-repeat; background-size: 13px 13px, 9px 9px; background-position: 0px 0px, 10px 10px; background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 6, from(transparent), color-stop(0.65, transparent), color-stop(0.8, #93989c), color-stop(0.95, transparent), to(transparent)), -webkit-gradient(linear, right top, left bottom, from(transparent), color-stop(0.425, transparent), color-stop(0.5, #93989c), color-stop(0.575, transparent), to(transparent)) !important; width: 15px; height: 15px; display: inline-block; vertical-align: middle; } .mblSearchBox { height: auto; } .dj_chrome .mblSearchBox { border-radius: 0; } .mblToggleButton { position: relative; padding: 0 10px 0 25px; height: 29px; border-width: 1px 1px 1px 1px; border-style: outset; background-image: -webkit-gradient(linear, left top, left bottom, from(#fdfdfd), to(#cecece), color-stop(0.5, #f8f8f8), color-stop(0.5, #eeeeee)); font-family: Helvetica; line-height: 29px; cursor: pointer; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); border-color: #9cacc0; border-radius: 5px; font-size: 13px; color: black; } .mblToggleButton:disabled { border-color: grey; background-image: none; color: grey; cursor: default; } .mblToggleButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#bfbfbf), color-stop(0.5, #ebebeb), color-stop(0.5, #dedede)); } .mblToggleButtonChecked { background-image: -webkit-gradient(linear, left top, left bottom, from(#7a9de9), to(#2362dd), color-stop(0.5, #366edf), color-stop(0.5, #215fdc)); color: white; } .mblToggleButtonChecked:after { position: absolute; content: ""; top: 6px; left: 7px; width: 5px; height: 10px; border-width: 2px; border-style: none solid solid none; -webkit-transform: rotate(45deg) skew(10deg); -webkit-transform-origin: 50% 50%; border-color: white; } .mblToggleButtonChecked.mblToggleButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#8ea4c1), to(#4a6c9b), color-stop(0.5, #5877a2), color-stop(0.5, #476999)); } .mblDomButtonGrayPlus { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayPlus > div { position: absolute; top: 12px; left: 6px; width: 18px; height: 3px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-radius: 2px; } .mblDomButtonGrayPlus > div > div { position: absolute; top: -8px; left: 7px; width: 3px; height: 17px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-left: 1px solid #808080; border-radius: 2px; } .mblDomButtonGrayMinus { position: relative; width: 29px; height: 29px; } .mblDomButtonGrayMinus > div { position: absolute; top: 12px; left: 6px; width: 18px; height: 3px; margin: 0px; font-size: 1px; background-color: #848684; border-top: 1px solid #525152; border-radius: 2px; } .mblValuePicker { height: 126px; } .mblValuePicker > .mblValuePickerSlot { float: left; margin: 0 3px; border-left: solid 2px #000000; border-right: solid 2px #000000; border-radius: 3px; } .mblValuePickerSlotButton { position: relative; height: 38px; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #9cb1c9), color-stop(0.35, #f0f1f5), color-stop(0.65, #f0f1f5), color-stop(0.9, #9cb1c9)); } .mblValuePickerSlotPlusButton { border-top-left-radius: 0; border-top-right-radius: 0; } .mblValuePickerSlotMinusButton { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .mblValuePickerSlotButtonSelected { background-image: -webkit-gradient(linear, left top, left bottom, from(#7c87a4), to(#263e6c), color-stop(0.5, #394d77), color-stop(0.5, #243b69)); } .mblValuePickerSlotIcon { top: 5px; margin: 0 auto; } .mblValuePickerSlotInputArea { position: relative; height: 48px; border-top: 1px solid #7b797b; border-bottom: 1px solid #c6c3c6; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #eaeaea), color-stop(0.2, #fafafa), color-stop(0.5, #ffffff), color-stop(0.9, #efefef)); } .mblValuePickerSlotInput { display: block; width: 90%; height: 90%; margin: 5% auto; padding: 0; text-align: center; border-style: none; background-color: transparent; font: bold 24px/44px Helvetica, sans-serif; } .mblValuePickerTimePicker > .mblToolBarButton { top: 45px; } .alertDialog { width: 100%; padding-left: 2px; padding-right: 2px; z-index: 1000; } .alertDialogBody { border: 1px solid #adaaad; border-radius: 10px; background-color: white; margin-left: 2px; margin-right: 4px; } .alertTitle { height: 42px; margin: 0px; padding: 0px; background-color: #889bb3; background: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2), color-stop(0.5, #889bb3), color-stop(0.5, #8195af)); border-top: 1px solid #cdd5df; border-bottom: 1px solid #2d3642; font-family: Helvetica; font-size: 20px; color: white; text-align: center; line-height: 44px; text-shadow: rgba(0,0,0,0.6) 0px -1px 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: center; } .alertText { text-align: center; } .alertBtns { padding: 5px; text-align: center; } .alertBtns .mblButton { width: 100%; margin-top: 5px; } .alertDialog.mblOut { position: absolute; } .alertDialog.mblIn { position: absolute; } .mblSlidev.mblOut { -webkit-animation-duration: .4s; -webkit-animation-name: mblSlideOut; -webkit-animation-timing-function: linear; -webkit-transform: translateY(-100%); } .mblSlidev.mblIn { -webkit-animation-duration: .4s; -webkit-animation-name: mblSlideIn; -webkit-animation-timing-function: linear; -webkit-transform: translateY(0px); } .mblSlidev.mblOut.mblReverse { -webkit-animation-name: mblSlideOutReverse; } .mblSlidev.mblIn.mblReverse { -webkit-animation-name: mblSlideInReverse; } .dialogUnderlayWrapper { position: absolute; left: 0; top: 0; z-index: 998; background: transparent !important; visibility: visible; height: 100%; width: 100%; } .dialogUnderlay { background-color: #eee; opacity: 0.5; width: 100%; height: 100%; } .list .row { padding: 10px; border-bottom: 1px solid #444; position: relative; background-color: white; z-index: 6; } .list .row.mblListItem { padding: 0px; } .list .row.last { border-bottom: none; } .list .row.hold { background-color: #ddd; } .list .buttons { position: absolute; text-align: center; padding-top: 10px; width: 100%; height: 100%; z-index: 5; } .list .buttons .mblButton { } .list .buttons .deleteBtn { background-color: red; } .list .buttons .cancelBtn { margin-left: 10px; background-color: blue; } .row.collapsed { -webkit-animation-name: collapse-vert; -webkit-animation-duration: 0.5s; -webkit-animation-timing-function: linear; } @-webkit-keyframes collapse-vert { from { height: 100%; padding: 10px; } to { height: 0px; padding: 0px; } } .listSelector { position: absolute; border-radius: 10px; -moz-border-radius: 10px; border: 1px solid #666; background-color: #ccc; color: #333; z-index: 1000; } .listSelectorRow { padding: 10px; border-bottom: 1px solid #666; white-space: nowrap; } .listSelectorRow-selected { background-color: #666; color: #ccc; } .listSelectorRow.last { border-bottom: none; } .mblImageView, .mblImageView canvas { width: 100%; height: 100%; } .mblPillar { display: none; } input { -webkit-text-size-adjust: 140%; } .mblImageThumbView { position: relative; -webkit-transition-property: height; -webkit-transition-duration: 0.8s; -webkit-transition-delay: 0; } .mblImageThumbView .mblThumb { width: 100px; min-height: 100px; display: inline-block; z-index: 2; position: absolute; } .mblImageThumbView.animated .mblThumb { -webkit-transition-property: -webkit-transform, opacity; -webkit-transition-duration: 1.3s, 1s; -webkit-transition-delay: 0, 0; } .mblImageThumbView .mblThumb.hidden { z-index: 1; opacity: 0; } .mblImageThumbView .mblThumbInner { width: 102px; height: 102px; position: relative; } .mblImageThumbView .mblThumbOverlay { width: 102px; height: 102px; background: url(images/thumb-overlay.png) center top no-repeat; position: absolute; z-index: 20; overflow: hidden; } .mblImageThumbView .mblThumb.selected .mblThumbOverlay { background-position: center bottom; } .mblImageThumbView .mblThumbInner .mblThumbMask { width: 90px; height: 90px; overflow: hidden; padding-left: 6px; padding-top: 5px; z-index: 10; } .mblImageThumbView .mblThumbInner .mblThumbMask img { left: 0px; top: 0px; width: 90px; height: 90px; } .mblImageThumbView .mblThumbInner .mblThumbMask .mblThumbSrc { left: 6px; top: 5px; background-position: center center; background-repeat: no-repeat; overflow: hidden; position: absolute; -webkit-background-size: 100% 100%; border-radius: 5px; width: 90px; height: 90px; z-index: 5; } .mblImageThumbView .mblThumbMask div { left: 0px; top: 0px; width: 90px; height: 90px; background-repeat: no-repeat; } .mblImageThumbView .mblThumb:hover, .mblImageThumbView .mblThumb.selected { -webkit-transform: scale(1.2); transform: scale(1.2); } .mblImageThumbView.large .mblThumb { width: 150px; min-height: 150px; } .mblImageThumbView.large .mblThumbInner{ width: 152px; height: 152px; } .mblImageThumbView.large .mblThumbOverlay { background: url(images/thumb-overlay-large.png) center top no-repeat; width: 152px; height: 152px; } .mblImageThumbView.large .mblThumbInner .mblThumbMask, .mblImageThumbView.large .mblThumbInner .mblThumbMask img, .mblImageThumbView.large .mblThumbInner .mblThumbMask .mblThumbSrc, .mblImageThumbView.large .mblThumbMask div { width: 133px; height: 133px; } .mblImageThumbView.large .mblThumbInner .mblThumbMask .mblThumbSrc { left: 9px; top: 7px; } .mblImageThumbView.small .mblThumb { width: 75px; min-height: 75px; } .mblImageThumbView.small .mblThumbInner{ width: 77px; height: 77px; } .mblImageThumbView.small .mblThumbOverlay { background: url(images/thumb-overlay-small.png) center top no-repeat; width: 77px; height: 77px; } .mblImageThumbView.small .mblThumbInner .mblThumbMask, .mblImageThumbView.small .mblThumbInner .mblThumbMask img, .mblImageThumbView.small .mblThumbInner .mblThumbMask .mblThumbSrc, .mblImageThumbView.small .mblThumbMask div { width: 70px; height: 70px; } .mblImageThumbView.small .mblThumbInner .mblThumbMask .mblThumbSrc { left: 4px; top: 3px; } .mblImageThumbView .mblThumbLabel { font-size: smaller; overflow: hidden; white-space: nowrap; text-align: center; }