html.mobile, .mobile body { width: 100%; margin: 0; padding: 0; } .mobile body { overflow-x: hidden; -webkit-text-size-adjust: none; background-color: #dedfde; font-family: Helvetica; font-size: 18px; } .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: black; background-color: #ced3ce; background-image: -webkit-gradient(linear, left top, left bottom, from(#f7fbf7), to(#cecfd6), color-stop(0.5, #ced3ce)); } .mblColorDefault45 { background-image: -webkit-gradient(linear, left top, right bottom, from(#f7fbf7), to(#cecfd6), color-stop(0.5, #ced3ce)); } .mblColorDefaultSel { color: white; background-color: #0869c6; background-image: -webkit-gradient(linear, left top, left bottom, from(#088eef), to(#0851ad), color-stop(0.5, #0869c6)); } .mblColorDefaultSel45 { background-image: -webkit-gradient(linear, left top, right bottom, from(#088eef), to(#0851ad), color-stop(0.5, #0869c6)); } .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(#4a4d52), to(#292c31)); border-top: 1px solid #63696b; border-bottom: 1px solid #292c31; color: white; } .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%; color: black; } .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.7, 1) rotate(45deg); border: 1px solid #9cacc0; } .mblToolBarButtonHasLeftArrow .mblToolBarButtonArrow { left: 1px; border: 1px inset #9cacc0; } .mblToolBarButtonHasRightArrow .mblToolBarButtonArrow { right: 0px; border: 1px inset #9cacc0; } .mblToolBarButtonBody { display: inline-block; position: relative; overflow: hidden; border-radius: 5px; border: 1px outset #9cacc0; } .mblToolBarButton .mblToolBarButtonBody { width: 100%; } .mblHeading .mblToolBarButtonBody { border: 1px inset #9cacc0; } .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 #c6c7c6; border-radius: 6px; background-color: white; color: black; } .mblRoundRect.mblShadow { -webkit-box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.35); } .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: 29px; border-top: 1px solid #313439; border-bottom: 1px solid #adaaad; background-color: white; color: #7b7d84; line-height: 29px; } .mblRoundRectCategory { margin: 18px 0 0 20px; padding: 0; font-family: Helvetica; font-size: 16px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: black; text-shadow: #ffffff 0 1px 0; } .mblRoundRectList { margin: 7px 9px 16px; padding: 0; border: 1px solid #c6c7c6; border-radius: 6px; background-color: white; } .mblRoundRectList .mblListItem:first-child, .mblRoundRectList .mblEdgeToEdgeCategory:first-child { border-top-left-radius: 6px; border-top-right-radius: 6px; } .mblRoundRectList .mblListItem:last-child, .mblRoundRectList .mblEdgeToEdgeCategory:last-child { border-bottom-width: 0; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .mblEdgeToEdgeList { margin: 0; padding: 0; background-color: white; } .mblEdgeToEdgeList .mblListItem:last-child { border-bottom-width: 0; } .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: 59px; list-style-type: none; line-height: 59px; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); border-bottom: 1px solid #dedfde; font-size: 18px; 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(#088eef), to(#0851ad), color-stop(0.5, #0869c6)); } .mblListItemSelected .mblDomButton div { border-color: white; } .mblListItemLabelSelected { background-color: #0869c6; } .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: 15px; margin-bottom: -15px; margin-right: 11px; } .mblListItemIcon { position: relative; float: left; line-height: normal; margin-top: 15px; margin-bottom: -15px; margin-right: 11px; } .mblListItemRightIcon, .mblListItemRightIcon2, .mblListItemUncheckIcon { position: relative; float: right; line-height: normal; margin-top: 15px; margin-bottom: -15px; } .mblListItemRightText { position: relative; float: right; line-height: normal; margin-right: 4px; color: black; margin-top: 19px; } .mblListItemLabel { position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; height: 100%; } .mblVariableHeight .mblListItemLabel { white-space: normal; } .mblListItemSubText { font-size: 14px; color: #7b7d48; } .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: 16px; } .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: rgba(176, 176, 176, 0.5) 1px inset; } .mblSwitchBgLeft { left: 0; color: white; background-color: #3f84eb; background-image: -webkit-gradient(linear, left top, left bottom, from(#088eef), to(#0851ad), color-stop(0.5, #0869c6)); } .mblSwitchBgRight { color: #7f7f7f; background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f3f7), to(#cec5d6), color-stop(0.5, #ced3ce)); } .mblSwitchKnob { position: absolute; top: 0; height: 27px; background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#999999), color-stop(0.5, #bbbbbb)); font-size: 1px; -webkit-box-sizing: border-box; border: rgba(156, 172, 192, 0.5) 1px outset; } .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: 6px; } .mblSwSquareShape .mblSwitchBgRight { left: 53px; } .mblSwSquareShape .mblSwitchKnob { left: 53px; width: 41px; border-radius: 6px; } .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: 94px; } .mblSwDefaultShape.mblSwitchOff .mblSwitchInner { left: -53px; } .mblSwDefaultShape .mblSwitchBg { border-radius: 6px; } .mblSwDefaultShape .mblSwitchBgRight { left: 53px; } .mblSwDefaultShape .mblSwitchKnob { left: 53px; width: 41px; border-radius: 6px; } .mblSwDefaultShape .mblSwitchText { width: 53px; } .mblSwDefaultShape .mblSwitchTextRight { left: 40px; } .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; }