.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; }