1/* 2* jQuery Mobile Framework Git Build: SHA1: c2d61e2e592c67519d9a9ed0ba796fa44787e136 <> Date: Tue Sep 25 10:38:12 2012 -0700 3* http://jquerymobile.com 4* 5* Copyright 2012 jQuery Foundation and other contributors 6* Released under the MIT license. 7* http://jquery.org/license 8* 9*/ 10 11 12/* Swatches */ 13/* A 14-----------------------------------------------------------------------------------------------------------*/ 15.ui-bar-a { 16 border: 1px solid #333 /*{a-bar-border}*/; 17 background: #111 /*{a-bar-background-color}*/; 18 color: #fff /*{a-bar-color}*/; 19 font-weight: bold; 20 text-shadow: 0 /*{a-bar-shadow-x}*/ -1px /*{a-bar-shadow-y}*/ 1px /*{a-bar-shadow-radius}*/ #000 /*{a-bar-shadow-color}*/; 21 background-image: -webkit-gradient(linear, left top, left bottom, from( #3D3E3E /*{a-bar-background-start}*/), to( #070608 /*{a-bar-background-end}*/)); /* Saf4+, Chrome */ 22 background-image: -webkit-linear-gradient( #3D3E3E /*{a-bar-background-start}*/, #070608 /*{a-bar-background-end}*/); /* Chrome 10+, Saf5.1+ */ 23 background-image: -moz-linear-gradient( #3D3E3E /*{a-bar-background-start}*/, #070608 /*{a-bar-background-end}*/); /* FF3.6 */ 24 background-image: -ms-linear-gradient( #3D3E3E /*{a-bar-background-start}*/, #070608 /*{a-bar-background-end}*/); /* IE10 */ 25 background-image: -o-linear-gradient( #3D3E3E /*{a-bar-background-start}*/, #070608 /*{a-bar-background-end}*/); /* Opera 11.10+ */ 26 background-image: linear-gradient( #3D3E3E /*{a-bar-background-start}*/, #070608 /*{a-bar-background-end}*/); 27} 28.ui-bar-a, 29.ui-bar-a input, 30.ui-bar-a select, 31.ui-bar-a textarea, 32.ui-bar-a button { 33 font-family: Helvetica, Arial, sans-serif /*{global-font-family}*/; 34} 35.ui-bar-a .ui-link-inherit { 36 color: #fff /*{a-bar-color}*/; 37} 38.ui-bar-a a.ui-link { 39 color: #7cc4e7 /*{a-bar-link-color}*/; 40 font-weight: bold; 41} 42.ui-bar-a a.ui-link:visited { 43 color: #2489ce /*{a-bar-link-visited}*/; 44} 45.ui-bar-a a.ui-link:hover { 46 color: #2489ce /*{a-bar-link-hover}*/; 47} 48.ui-bar-a a.ui-link:active { 49 color: #2489ce /*{a-bar-link-active}*/; 50} 51.ui-body-a, 52.ui-overlay-a { 53 border: 1px solid #444 /*{a-body-border}*/; 54 background: #222 /*{a-body-background-color}*/; 55 color: #fff /*{a-body-color}*/; 56 text-shadow: 0 /*{a-body-shadow-x}*/ 1px /*{a-body-shadow-y}*/ 1px /*{a-body-shadow-radius}*/ #111 /*{a-body-shadow-color}*/; 57 font-weight: normal; 58 background-image: -webkit-gradient(linear, left top, left bottom, from( #444 /*{a-body-background-start}*/), to( #222 /*{a-body-background-end}*/)); /* Saf4+, Chrome */ 59 background-image: -webkit-linear-gradient( #444 /*{a-body-background-start}*/, #222 /*{a-body-background-end}*/); /* Chrome 10+, Saf5.1+ */ 60 background-image: -moz-linear-gradient( #444 /*{a-body-background-start}*/, #222 /*{a-body-background-end}*/); /* FF3.6 */ 61 background-image: -ms-linear-gradient( #444 /*{a-body-background-start}*/, #222 /*{a-body-background-end}*/); /* IE10 */ 62 background-image: -o-linear-gradient( #444 /*{a-body-background-start}*/, #222 /*{a-body-background-end}*/); /* Opera 11.10+ */ 63 background-image: linear-gradient( #444 /*{a-body-background-start}*/, #222 /*{a-body-background-end}*/); 64} 65.ui-overlay-a { 66 background-image: none; 67 border-width: 0; 68} 69.ui-body-a, 70.ui-body-a input, 71.ui-body-a select, 72.ui-body-a textarea, 73.ui-body-a button { 74 font-family: Helvetica, Arial, sans-serif /*{global-font-family}*/; 75} 76.ui-body-a .ui-link-inherit { 77 color: #fff /*{a-body-color}*/; 78} 79.ui-body-a .ui-link { 80 color: #2489ce /*{a-body-link-color}*/; 81 font-weight: bold; 82} 83.ui-body-a .ui-link:visited { 84 color: #2489ce /*{a-body-link-visited}*/; 85} 86.ui-body-a .ui-link:hover { 87 color: #2489ce /*{a-body-link-hover}*/; 88} 89.ui-body-a .ui-link:active { 90 color: #2489ce /*{a-body-link-active}*/; 91} 92.ui-btn-up-a { 93 border: 1px solid #111 /*{a-bup-border}*/; 94 background: #333 /*{a-bup-background-color}*/; 95 font-weight: bold; 96 color: #fff /*{a-bup-color}*/; 97 text-shadow: 0 /*{a-bup-shadow-x}*/ 1px /*{a-bup-shadow-y}*/ 1px /*{a-bup-shadow-radius}*/ #111 /*{a-bup-shadow-color}*/; 98 background-image: -webkit-gradient(linear, left top, left bottom, from( #444 /*{a-bup-background-start}*/), to( #2d2d2d /*{a-bup-background-end}*/)); /* Saf4+, Chrome */ 99 background-image: -webkit-linear-gradient( #444 /*{a-bup-background-start}*/, #2d2d2d /*{a-bup-background-end}*/); /* Chrome 10+, Saf5.1+ */ 100 background-image: -moz-linear-gradient( #444 /*{a-bup-background-start}*/, #2d2d2d /*{a-bup-background-end}*/); /* FF3.6 */ 101 background-image: -ms-linear-gradient( #444 /*{a-bup-background-start}*/, #2d2d2d /*{a-bup-background-end}*/); /* IE10 */ 102 background-image: -o-linear-gradient( #444 /*{a-bup-background-start}*/, #2d2d2d /*{a-bup-background-end}*/); /* Opera 11.10+ */ 103 background-image: linear-gradient( #444 /*{a-bup-background-start}*/, #2d2d2d /*{a-bup-background-end}*/); 104} 105.ui-btn-up-a:visited, 106.ui-btn-up-a a.ui-link-inherit { 107 color: #fff /*{a-bup-color}*/; 108} 109.ui-btn-hover-a { 110 border: 1px solid #000 /*{a-bhover-border}*/; 111 background: #444 /*{a-bhover-background-color}*/; 112 font-weight: bold; 113 color: #fff /*{a-bhover-color}*/; 114 text-shadow: 0 /*{a-bhover-shadow-x}*/ 1px /*{a-bhover-shadow-y}*/ 1px /*{a-bhover-shadow-radius}*/ #111 /*{a-bhover-shadow-color}*/; 115 background-image: -webkit-gradient(linear, left top, left bottom, from( #555 /*{a-bhover-background-start}*/), to( #383838 /*{a-bhover-background-end}*/)); /* Saf4+, Chrome */ 116 background-image: -webkit-linear-gradient( #555 /*{a-bhover-background-start}*/, #383838 /*{a-bhover-background-end}*/); /* Chrome 10+, Saf5.1+ */ 117 background-image: -moz-linear-gradient( #555 /*{a-bhover-background-start}*/, #383838 /*{a-bhover-background-end}*/); /* FF3.6 */ 118 background-image: -ms-linear-gradient( #555 /*{a-bhover-background-start}*/, #383838 /*{a-bhover-background-end}*/); /* IE10 */ 119 background-image: -o-linear-gradient( #555 /*{a-bhover-background-start}*/, #383838 /*{a-bhover-background-end}*/); /* Opera 11.10+ */ 120 background-image: linear-gradient( #555 /*{a-bhover-background-start}*/, #383838 /*{a-bhover-background-end}*/); 121} 122.ui-btn-hover-a:visited, 123.ui-btn-hover-a:hover, 124.ui-btn-hover-a a.ui-link-inherit { 125 color: #fff /*{a-bhover-color}*/; 126} 127.ui-btn-down-a { 128 border: 1px solid #000 /*{a-bdown-border}*/; 129 background: #222 /*{a-bdown-background-color}*/; 130 font-weight: bold; 131 color: #fff /*{a-bdown-color}*/; 132 text-shadow: 0 /*{a-bdown-shadow-x}*/ 1px /*{a-bdown-shadow-y}*/ 1px /*{a-bdown-shadow-radius}*/ #111 /*{a-bdown-shadow-color}*/; 133 background-image: -webkit-gradient(linear, left top, left bottom, from( #202020 /*{a-bdown-background-start}*/), to( #2c2c2c /*{a-bdown-background-end}*/)); /* Saf4+, Chrome */ 134 background-image: -webkit-linear-gradient( #202020 /*{a-bdown-background-start}*/, #2c2c2c /*{a-bdown-background-end}*/); /* Chrome 10+, Saf5.1+ */ 135 background-image: -moz-linear-gradient( #202020 /*{a-bdown-background-start}*/, #2c2c2c /*{a-bdown-background-end}*/); /* FF3.6 */ 136 background-image: -ms-linear-gradient( #202020 /*{a-bdown-background-start}*/, #2c2c2c /*{a-bdown-background-end}*/); /* IE10 */ 137 background-image: -o-linear-gradient( #202020 /*{a-bdown-background-start}*/, #2c2c2c /*{a-bdown-background-end}*/); /* Opera 11.10+ */ 138 background-image: linear-gradient( #202020 /*{a-bdown-background-start}*/, #2c2c2c /*{a-bdown-background-end}*/); 139} 140.ui-btn-down-a:visited, 141.ui-btn-down-a:hover, 142.ui-btn-down-a a.ui-link-inherit { 143 color: #fff /*{a-bdown-color}*/; 144} 145.ui-btn-up-a, 146.ui-btn-hover-a, 147.ui-btn-down-a { 148 font-family: Helvetica, Arial, sans-serif /*{global-font-family}*/; 149 text-decoration: none; 150} 151 152/* Structure */ 153/* links within "buttons" 154-----------------------------------------------------------------------------------------------------------*/ 155a.ui-link-inherit { 156 text-decoration: none !important; 157} 158/* Active class used as the "on" state across all themes 159-----------------------------------------------------------------------------------------------------------*/ 160.ui-btn-active { 161 border: 1px solid #2373a5 /*{global-active-border}*/; 162 background: #5393c5 /*{global-active-background-color}*/; 163 font-weight: bold; 164 color: #fff /*{global-active-color}*/; 165 cursor: pointer; 166 text-shadow: 0 /*{global-active-shadow-x}*/ 1px /*{global-active-shadow-y}*/ 1px /*{global-active-shadow-radius}*/ #3373a5 /*{global-active-shadow-color}*/; 167 text-decoration: none; 168 background-image: -webkit-gradient(linear, left top, left bottom, from( #5393c5 /*{global-active-background-start}*/), to( #6facd5 /*{global-active-background-end}*/)); /* Saf4+, Chrome */ 169 background-image: -webkit-linear-gradient( #5393c5 /*{global-active-background-start}*/, #6facd5 /*{global-active-background-end}*/); /* Chrome 10+, Saf5.1+ */ 170 background-image: -moz-linear-gradient( #5393c5 /*{global-active-background-start}*/, #6facd5 /*{global-active-background-end}*/); /* FF3.6 */ 171 background-image: -ms-linear-gradient( #5393c5 /*{global-active-background-start}*/, #6facd5 /*{global-active-background-end}*/); /* IE10 */ 172 background-image: -o-linear-gradient( #5393c5 /*{global-active-background-start}*/, #6facd5 /*{global-active-background-end}*/); /* Opera 11.10+ */ 173 background-image: linear-gradient( #5393c5 /*{global-active-background-start}*/, #6facd5 /*{global-active-background-end}*/); 174 font-family: Helvetica, Arial, sans-serif /*{global-font-family}*/; 175} 176.ui-btn-active:visited, 177.ui-btn-active:hover, 178.ui-btn-active a.ui-link-inherit { 179 color: #fff /*{global-active-color}*/; 180} 181/* button inner top highlight 182-----------------------------------------------------------------------------------------------------------*/ 183.ui-btn-inner { 184 border-top: 1px solid #fff; 185 border-color: rgba(255,255,255,.3); 186} 187/* corner rounding classes 188-----------------------------------------------------------------------------------------------------------*/ 189.ui-corner-tl { 190 -moz-border-radius-topleft: .6em /*{global-radii-blocks}*/; 191 -webkit-border-top-left-radius: .6em /*{global-radii-blocks}*/; 192 border-top-left-radius: .6em /*{global-radii-blocks}*/; 193} 194.ui-corner-tr { 195 -moz-border-radius-topright: .6em /*{global-radii-blocks}*/; 196 -webkit-border-top-right-radius: .6em /*{global-radii-blocks}*/; 197 border-top-right-radius: .6em /*{global-radii-blocks}*/; 198} 199.ui-corner-bl { 200 -moz-border-radius-bottomleft: .6em /*{global-radii-blocks}*/; 201 -webkit-border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 202 border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 203} 204.ui-corner-br { 205 -moz-border-radius-bottomright: .6em /*{global-radii-blocks}*/; 206 -webkit-border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 207 border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 208} 209.ui-corner-top { 210 -moz-border-radius-topleft: .6em /*{global-radii-blocks}*/; 211 -webkit-border-top-left-radius: .6em /*{global-radii-blocks}*/; 212 border-top-left-radius: .6em /*{global-radii-blocks}*/; 213 -moz-border-radius-topright: .6em /*{global-radii-blocks}*/; 214 -webkit-border-top-right-radius: .6em /*{global-radii-blocks}*/; 215 border-top-right-radius: .6em /*{global-radii-blocks}*/; 216} 217.ui-corner-bottom { 218 -moz-border-radius-bottomleft: .6em /*{global-radii-blocks}*/; 219 -webkit-border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 220 border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 221 -moz-border-radius-bottomright: .6em /*{global-radii-blocks}*/; 222 -webkit-border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 223 border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 224 } 225.ui-corner-right { 226 -moz-border-radius-topright: .6em /*{global-radii-blocks}*/; 227 -webkit-border-top-right-radius: .6em /*{global-radii-blocks}*/; 228 border-top-right-radius: .6em /*{global-radii-blocks}*/; 229 -moz-border-radius-bottomright: .6em /*{global-radii-blocks}*/; 230 -webkit-border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 231 border-bottom-right-radius: .6em /*{global-radii-blocks}*/; 232} 233.ui-corner-left { 234 -moz-border-radius-topleft: .6em /*{global-radii-blocks}*/; 235 -webkit-border-top-left-radius: .6em /*{global-radii-blocks}*/; 236 border-top-left-radius: .6em /*{global-radii-blocks}*/; 237 -moz-border-radius-bottomleft: .6em /*{global-radii-blocks}*/; 238 -webkit-border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 239 border-bottom-left-radius: .6em /*{global-radii-blocks}*/; 240} 241.ui-corner-all { 242 -moz-border-radius: .6em /*{global-radii-blocks}*/; 243 -webkit-border-radius: .6em /*{global-radii-blocks}*/; 244 border-radius: .6em /*{global-radii-blocks}*/; 245} 246.ui-corner-none { 247 -moz-border-radius: 0; 248 -webkit-border-radius: 0; 249 border-radius: 0; 250} 251/* Form field separator 252-----------------------------------------------------------------------------------------------------------*/ 253.ui-br { 254 border-bottom: rgb(130,130,130); 255 border-bottom: rgba(130,130,130,.3); 256 border-bottom-width: 1px; 257 border-bottom-style: solid; 258} 259/* Interaction cues 260-----------------------------------------------------------------------------------------------------------*/ 261.ui-disabled { 262 filter: Alpha(Opacity=30); 263 opacity: .3; 264 zoom: 1; 265} 266.ui-disabled, 267.ui-disabled a { 268 cursor: default !important; 269 pointer-events: none; 270} 271/* Icons 272-----------------------------------------------------------------------------------------------------------*/ 273.ui-icon, 274.ui-icon-searchfield:after { 275 background: #666 /*{global-icon-color}*/; 276 background: rgba(0,0,0,.4) /*{global-icon-disc}*/; 277 background-image: url(images/icons-18-white.png) /*{global-icon-set}*/; 278 background-repeat: no-repeat; 279 -moz-border-radius: 9px; 280 -webkit-border-radius: 9px; 281 border-radius: 9px; 282} 283/* Alt icon color 284-----------------------------------------------------------------------------------------------------------*/ 285.ui-icon-alt { 286 background: #fff; 287 background: rgba(255,255,255,.3); 288 background-image: url(images/icons-18-black.png); 289 background-repeat: no-repeat; 290} 291/* HD/"retina" sprite 292-----------------------------------------------------------------------------------------------------------*/ 293@media only screen and (-webkit-min-device-pixel-ratio: 1.5), 294 only screen and (min--moz-device-pixel-ratio: 1.5), 295 only screen and (min-resolution: 240dpi) { 296 297 .ui-icon-plus, .ui-icon-minus, .ui-icon-delete, .ui-icon-arrow-r, 298 .ui-icon-arrow-l, .ui-icon-arrow-u, .ui-icon-arrow-d, .ui-icon-check, 299 .ui-icon-gear, .ui-icon-refresh, .ui-icon-forward, .ui-icon-back, 300 .ui-icon-grid, .ui-icon-star, .ui-icon-alert, .ui-icon-info, .ui-icon-home, .ui-icon-search, .ui-icon-searchfield:after, 301 .ui-icon-checkbox-off, .ui-icon-checkbox-on, .ui-icon-radio-off, .ui-icon-radio-on { 302 background-image: url(images/icons-36-white.png); 303 -moz-background-size: 776px 18px; 304 -o-background-size: 776px 18px; 305 -webkit-background-size: 776px 18px; 306 background-size: 776px 18px; 307 } 308 .ui-icon-alt { 309 background-image: url(images/icons-36-black.png); 310 } 311} 312/* plus minus */ 313.ui-icon-plus { 314 background-position: -0 50%; 315} 316.ui-icon-minus { 317 background-position: -36px 50%; 318} 319/* delete/close */ 320.ui-icon-delete { 321 background-position: -72px 50%; 322} 323/* arrows */ 324.ui-icon-arrow-r { 325 background-position: -108px 50%; 326} 327.ui-icon-arrow-l { 328 background-position: -144px 50%; 329} 330.ui-icon-arrow-u { 331 background-position: -180px 50%; 332} 333.ui-icon-arrow-d { 334 background-position: -216px 50%; 335} 336/* misc */ 337.ui-icon-check { 338 background-position: -252px 50%; 339} 340.ui-icon-gear { 341 background-position: -288px 50%; 342} 343.ui-icon-refresh { 344 background-position: -324px 50%; 345} 346.ui-icon-forward { 347 background-position: -360px 50%; 348} 349.ui-icon-back { 350 background-position: -396px 50%; 351} 352.ui-icon-grid { 353 background-position: -432px 50%; 354} 355.ui-icon-star { 356 background-position: -468px 50%; 357} 358.ui-icon-alert { 359 background-position: -504px 50%; 360} 361.ui-icon-info { 362 background-position: -540px 50%; 363} 364.ui-icon-home { 365 background-position: -576px 50%; 366} 367.ui-icon-search, 368.ui-icon-searchfield:after { 369 background-position: -612px 50%; 370} 371.ui-icon-checkbox-off { 372 background-position: -684px 50%; 373} 374.ui-icon-checkbox-on { 375 background-position: -648px 50%; 376} 377.ui-icon-radio-off { 378 background-position: -756px 50%; 379} 380.ui-icon-radio-on { 381 background-position: -720px 50%; 382} 383/* checks,radios */ 384.ui-checkbox .ui-icon, 385.ui-selectmenu-list .ui-icon { 386 -moz-border-radius: 3px; 387 -webkit-border-radius: 3px; 388 border-radius: 3px; 389} 390.ui-icon-checkbox-off, 391.ui-icon-radio-off { 392 background-color: transparent; 393} 394.ui-checkbox-on .ui-icon, 395.ui-radio-on .ui-icon { 396 background-color: #4596ce /*{global-active-background-color}*/; /* NOTE: this hex should match the active state color. It's repeated here for cascade */ 397} 398/* loading icon */ 399.ui-icon-loading { 400 background: url(images/ajax-loader.gif); 401 background-size: 46px 46px; 402} 403/* Button corner classes 404-----------------------------------------------------------------------------------------------------------*/ 405.ui-btn-corner-tl { 406 -moz-border-radius-topleft: 1em /*{global-radii-buttons}*/; 407 -webkit-border-top-left-radius: 1em /*{global-radii-buttons}*/; 408 border-top-left-radius: 1em /*{global-radii-buttons}*/; 409} 410.ui-btn-corner-tr { 411 -moz-border-radius-topright: 1em /*{global-radii-buttons}*/; 412 -webkit-border-top-right-radius: 1em /*{global-radii-buttons}*/; 413 border-top-right-radius: 1em /*{global-radii-buttons}*/; 414} 415.ui-btn-corner-bl { 416 -moz-border-radius-bottomleft: 1em /*{global-radii-buttons}*/; 417 -webkit-border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 418 border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 419} 420.ui-btn-corner-br { 421 -moz-border-radius-bottomright: 1em /*{global-radii-buttons}*/; 422 -webkit-border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 423 border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 424} 425.ui-btn-corner-top { 426 -moz-border-radius-topleft: 1em /*{global-radii-buttons}*/; 427 -webkit-border-top-left-radius: 1em /*{global-radii-buttons}*/; 428 border-top-left-radius: 1em /*{global-radii-buttons}*/; 429 -moz-border-radius-topright: 1em /*{global-radii-buttons}*/; 430 -webkit-border-top-right-radius: 1em /*{global-radii-buttons}*/; 431 border-top-right-radius: 1em /*{global-radii-buttons}*/; 432} 433.ui-btn-corner-bottom { 434 -moz-border-radius-bottomleft: 1em /*{global-radii-buttons}*/; 435 -webkit-border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 436 border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 437 -moz-border-radius-bottomright: 1em /*{global-radii-buttons}*/; 438 -webkit-border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 439 border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 440} 441.ui-btn-corner-right { 442 -moz-border-radius-topright: 1em /*{global-radii-buttons}*/; 443 -webkit-border-top-right-radius: 1em /*{global-radii-buttons}*/; 444 border-top-right-radius: 1em /*{global-radii-buttons}*/; 445 -moz-border-radius-bottomright: 1em /*{global-radii-buttons}*/; 446 -webkit-border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 447 border-bottom-right-radius: 1em /*{global-radii-buttons}*/; 448} 449.ui-btn-corner-left { 450 -moz-border-radius-topleft: 1em /*{global-radii-buttons}*/; 451 -webkit-border-top-left-radius: 1em /*{global-radii-buttons}*/; 452 border-top-left-radius: 1em /*{global-radii-buttons}*/; 453 -moz-border-radius-bottomleft: 1em /*{global-radii-buttons}*/; 454 -webkit-border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 455 border-bottom-left-radius: 1em /*{global-radii-buttons}*/; 456} 457.ui-btn-corner-all { 458 -moz-border-radius: 1em /*{global-radii-buttons}*/; 459 -webkit-border-radius: 1em /*{global-radii-buttons}*/; 460 border-radius: 1em /*{global-radii-buttons}*/; 461} 462/* radius clip workaround for cleaning up corner trapping */ 463.ui-corner-tl, 464.ui-corner-tr, 465.ui-corner-bl, 466.ui-corner-br, 467.ui-corner-top, 468.ui-corner-bottom, 469.ui-corner-right, 470.ui-corner-left, 471.ui-corner-all, 472.ui-btn-corner-tl, 473.ui-btn-corner-tr, 474.ui-btn-corner-bl, 475.ui-btn-corner-br, 476.ui-btn-corner-top, 477.ui-btn-corner-bottom, 478.ui-btn-corner-right, 479.ui-btn-corner-left, 480.ui-btn-corner-all { 481 -webkit-background-clip: padding-box; 482 -moz-background-clip: padding; 483 background-clip: padding-box; 484} 485/* Overlay / modal 486-----------------------------------------------------------------------------------------------------------*/ 487.ui-overlay { 488 background: #666; 489 filter: Alpha(Opacity=50); 490 opacity: .5; 491 position: absolute; 492 width: 100%; 493 height: 100%; 494} 495.ui-overlay-shadow { 496 -moz-box-shadow: 0px 0px 12px rgba(0,0,0,.6); 497 -webkit-box-shadow: 0px 0px 12px rgba(0,0,0,.6); 498 box-shadow: 0px 0px 12px rgba(0,0,0,.6); 499} 500.ui-shadow { 501 -moz-box-shadow: 0px 1px 4px /*{global-box-shadow-size}*/ rgba(0,0,0,.3) /*{global-box-shadow-color}*/; 502 -webkit-box-shadow: 0px 1px 4px /*{global-box-shadow-size}*/ rgba(0,0,0,.3) /*{global-box-shadow-color}*/; 503 box-shadow: 0px 1px 4px /*{global-box-shadow-size}*/ rgba(0,0,0,.3) /*{global-box-shadow-color}*/; 504} 505.ui-bar-a .ui-shadow, 506.ui-bar-b .ui-shadow , 507.ui-bar-c .ui-shadow { 508 -moz-box-shadow: 0px 1px 0 rgba(255,255,255,.3); 509 -webkit-box-shadow: 0px 1px 0 rgba(255,255,255,.3); 510 box-shadow: 0px 1px 0 rgba(255,255,255,.3); 511} 512.ui-shadow-inset { 513 -moz-box-shadow: inset 0px 1px 4px rgba(0,0,0,.2); 514 -webkit-box-shadow: inset 0px 1px 4px rgba(0,0,0,.2); 515 box-shadow: inset 0px 1px 4px rgba(0,0,0,.2); 516} 517.ui-icon-shadow { 518 -moz-box-shadow: 0px 1px 0 rgba(255,255,255,.4) /*{global-icon-shadow}*/; 519 -webkit-box-shadow: 0px 1px 0 rgba(255,255,255,.4) /*{global-icon-shadow}*/; 520 box-shadow: 0px 1px 0 rgba(255,255,255,.4) /*{global-icon-shadow}*/; 521} 522/* Focus state - set here for specificity (note: these classes are added by JavaScript) 523-----------------------------------------------------------------------------------------------------------*/ 524.ui-btn:focus, .ui-link-inherit:focus { 525 outline: 0; 526} 527.ui-btn.ui-focus { 528 z-index: 1; 529} 530.ui-focus, 531.ui-btn:focus { 532 -moz-box-shadow: inset 0px 0px 3px #387bbe /*{global-active-background-color}*/, 0px 0px 9px #387bbe /*{global-active-background-color}*/; 533 -webkit-box-shadow: inset 0px 0px 3px #387bbe /*{global-active-background-color}*/, 0px 0px 9px #387bbe /*{global-active-background-color}*/; 534 box-shadow: inset 0px 0px 3px #387bbe /*{global-active-background-color}*/, 0px 0px 9px #387bbe /*{global-active-background-color}*/; 535} 536.ui-input-text.ui-focus, 537.ui-input-search.ui-focus { 538 -moz-box-shadow: 0px 0px 12px #387bbe /*{global-active-background-color}*/; 539 -webkit-box-shadow: 0px 0px 12px #387bbe /*{global-active-background-color}*/; 540 box-shadow: 0px 0px 12px #387bbe /*{global-active-background-color}*/; 541} 542/* unset box shadow in browsers that don't do it right 543-----------------------------------------------------------------------------------------------------------*/ 544.ui-mobile-nosupport-boxshadow * { 545 -moz-box-shadow: none !important; 546 -webkit-box-shadow: none !important; 547 box-shadow: none !important; 548} 549/* ...and bring back focus */ 550.ui-mobile-nosupport-boxshadow .ui-focus, 551.ui-mobile-nosupport-boxshadow .ui-btn:focus, 552.ui-mobile-nosupport-boxshadow .ui-link-inherit:focus { 553 outline-width: 1px; 554 outline-style: auto; 555} 556/* some unsets - more probably needed */ 557.ui-mobile, .ui-mobile body { height: 99.9%; } 558.ui-mobile fieldset, .ui-page { padding: 0; margin: 0; } 559.ui-mobile a img, .ui-mobile fieldset { border-width: 0; } 560/* responsive page widths */ 561.ui-mobile-viewport { margin: 0; overflow-x: visible; -webkit-text-size-adjust: 100%; -ms-text-size-adjust:none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } 562/* Issue #2066 */ 563body.ui-mobile-viewport, 564div.ui-mobile-viewport { overflow-x: hidden; } 565/* "page" containers - full-screen views, one should always be in view post-pageload */ 566.ui-mobile [data-role=page], .ui-mobile [data-role=dialog], .ui-page { top: 0; left: 0; width: 100%; min-height: 100%; position: absolute; display: none; border: 0; } 567.ui-mobile .ui-page-active { display: block; overflow: visible; } 568/* on ios4, setting focus on the page element causes flashing during transitions when there is an outline, so we turn off outlines */ 569.ui-page { outline: none; } 570/*orientations from js are available */ 571@media screen and (orientation: portrait){ 572.ui-mobile, .ui-mobile .ui-page { min-height: 420px; } 573} 574@media screen and (orientation: landscape){ 575.ui-mobile, .ui-mobile .ui-page { min-height: 300px; } 576} 577/* loading screen */ 578.ui-loading .ui-loader { display: block; } 579.ui-loader { display: none; z-index: 9999999; position: fixed; top: 50%; left: 50%; border:0; } 580.ui-loader-default { background: none; filter: Alpha(Opacity=18); opacity: .18; width: 46px; height: 46px; margin-left: -23px; margin-top: -23px; } 581.ui-loader-verbose { width: 200px; filter: Alpha(Opacity=88); opacity: .88; box-shadow: 0 1px 1px -1px #fff; height: auto; margin-left: -110px; margin-top: -43px; padding: 10px; } 582.ui-loader-default h1 { font-size: 0; width: 0; height: 0; overflow: hidden; } 583.ui-loader-verbose h1 { font-size: 16px; margin: 0; text-align: center; } 584.ui-loader .ui-icon { background-color: #000; display: block; margin: 0; width: 44px; height: 44px; padding: 1px; -webkit-border-radius: 36px; -moz-border-radius: 36px; border-radius: 36px; } 585.ui-loader-verbose .ui-icon { margin: 0 auto 10px; filter: Alpha(Opacity=75); opacity: .75; } 586.ui-loader-textonly { padding: 15px; margin-left: -115px; } 587.ui-loader-textonly .ui-icon { display: none; } 588.ui-loader-fakefix { position: absolute; } 589/*fouc*/ 590.ui-mobile-rendering > * { visibility: hidden; } 591/*headers, content panels*/ 592.ui-bar, .ui-body { position: relative; padding: .4em 15px; overflow: hidden; display: block; clear:both; } 593.ui-bar { font-size: 16px; margin: 0; } 594.ui-bar h1, .ui-bar h2, .ui-bar h3, .ui-bar h4, .ui-bar h5, .ui-bar h6 { margin: 0; padding: 0; font-size: 16px; display: inline-block; } 595.ui-header, .ui-footer { position: relative; border-left-width: 0; border-right-width: 0; zoom: 1; } 596.ui-header .ui-btn-left, 597.ui-header .ui-btn-right, 598.ui-footer .ui-btn-left, 599.ui-footer .ui-btn-right { position: absolute; top: 3px; } 600.ui-header .ui-btn-left, 601.ui-footer .ui-btn-left { left: 5px; } 602.ui-header .ui-btn-right, 603.ui-footer .ui-btn-right { right: 5px; } 604.ui-footer .ui-btn-icon-notext, 605.ui-header .ui-btn-icon-notext { top: 6px; } 606.ui-header .ui-title, .ui-footer .ui-title { min-height: 1.1em; text-align: center; font-size: 16px; display: block; margin: .6em 30% .8em; padding: 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; outline: 0 !important; } 607.ui-footer .ui-title { margin: .6em 15px .8em; } 608/*content area*/ 609.ui-content { border-width: 0; overflow: visible; overflow-x: hidden; padding: 15px; } 610/* icons sizing */ 611.ui-icon { width: 18px; height: 18px; } 612/* non-js content hiding */ 613.ui-nojs { position: absolute; left: -9999px; } 614/* accessible content hiding */ 615.ui-hide-label label.ui-input-text, .ui-hide-label label.ui-select, .ui-hide-label label.ui-slider, .ui-hide-label label.ui-submit, .ui-hide-label .ui-controlgroup-label, 616.ui-hidden-accessible { position: absolute !important; left: -9999px; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } 617/* Transitions originally inspired by those from jQtouch, nice work, folks */ 618.ui-mobile-viewport-transitioning, 619.ui-mobile-viewport-transitioning .ui-page { 620 width: 100%; 621 height: 100%; 622 overflow: hidden; 623 -webkit-box-sizing: border-box; 624 -moz-box-sizing: border-box; 625 box-sizing: border-box; 626} 627.ui-page-pre-in { 628 opacity: 0; 629} 630.in { 631 -webkit-animation-timing-function: ease-out; 632 -webkit-animation-duration: 350ms; 633 -moz-animation-timing-function: ease-out; 634 -moz-animation-duration: 350ms; 635} 636.out { 637 -webkit-animation-timing-function: ease-in; 638 -webkit-animation-duration: 225ms; 639 -moz-animation-timing-function: ease-in; 640 -moz-animation-duration: 225ms; 641} 642@-webkit-keyframes fadein { 643 from { opacity: 0; } 644 to { opacity: 1; } 645} 646@-moz-keyframes fadein { 647 from { opacity: 0; } 648 to { opacity: 1; } 649} 650@-webkit-keyframes fadeout { 651 from { opacity: 1; } 652 to { opacity: 0; } 653} 654@-moz-keyframes fadeout { 655 from { opacity: 1; } 656 to { opacity: 0; } 657} 658.fade.out { 659 opacity: 0; 660 -webkit-animation-duration: 125ms; 661 -webkit-animation-name: fadeout; 662 -moz-animation-duration: 125ms; 663 -moz-animation-name: fadeout; 664} 665.fade.in { 666 opacity: 1; 667 -webkit-animation-duration: 225ms; 668 -webkit-animation-name: fadein; 669 -moz-animation-duration: 225ms; 670 -moz-animation-name: fadein; 671} 672.pop { 673 -webkit-transform-origin: 50% 50%; 674 -moz-transform-origin: 50% 50%; 675} 676.pop.in { 677 -webkit-transform: scale(1); 678 -moz-transform: scale(1); 679 opacity: 1; 680 -webkit-animation-name: popin; 681 -moz-animation-name: popin; 682 -webkit-animation-duration: 350ms; 683 -moz-animation-duration: 350ms; 684} 685.pop.out { 686 -webkit-animation-name: fadeout; 687 -moz-animation-name: fadeout; 688 opacity: 0; 689 -webkit-animation-duration: 100ms; 690 -moz-animation-duration: 100ms; 691} 692.pop.in.reverse { 693 -webkit-animation-name: fadein; 694 -moz-animation-name: fadein; 695} 696.pop.out.reverse { 697 -webkit-transform: scale(.8); 698 -moz-transform: scale(.8); 699 -webkit-animation-name: popout; 700 -moz-animation-name: popout; 701} 702@-webkit-keyframes popin { 703 from { 704 -webkit-transform: scale(.8); 705 opacity: 0; 706 } 707 to { 708 -webkit-transform: scale(1); 709 opacity: 1; 710 } 711} 712@-moz-keyframes popin { 713 from { 714 -moz-transform: scale(.8); 715 opacity: 0; 716 } 717 to { 718 -moz-transform: scale(1); 719 opacity: 1; 720 } 721} 722@-webkit-keyframes popout { 723 from { 724 -webkit-transform: scale(1); 725 opacity: 1; 726 } 727 to { 728 -webkit-transform: scale(.8); 729 opacity: 0; 730 } 731} 732@-moz-keyframes popout { 733 from { 734 -moz-transform: scale(1); 735 opacity: 1; 736 } 737 to { 738 -moz-transform: scale(.8); 739 opacity: 0; 740 } 741} 742/* keyframes for slidein from sides */ 743@-webkit-keyframes slideinfromright { 744 from { -webkit-transform: translateX(100%); } 745 to { -webkit-transform: translateX(0); } 746} 747@-moz-keyframes slideinfromright { 748 from { -moz-transform: translateX(100%); } 749 to { -moz-transform: translateX(0); } 750} 751@-webkit-keyframes slideinfromleft { 752 from { -webkit-transform: translateX(-100%); } 753 to { -webkit-transform: translateX(0); } 754} 755@-moz-keyframes slideinfromleft { 756 from { -moz-transform: translateX(-100%); } 757 to { -moz-transform: translateX(0); } 758} 759/* keyframes for slideout to sides */ 760@-webkit-keyframes slideouttoleft { 761 from { -webkit-transform: translateX(0); } 762 to { -webkit-transform: translateX(-100%); } 763} 764@-moz-keyframes slideouttoleft { 765 from { -moz-transform: translateX(0); } 766 to { -moz-transform: translateX(-100%); } 767} 768@-webkit-keyframes slideouttoright { 769 from { -webkit-transform: translateX(0); } 770 to { -webkit-transform: translateX(100%); } 771} 772@-moz-keyframes slideouttoright { 773 from { -moz-transform: translateX(0); } 774 to { -moz-transform: translateX(100%); } 775} 776.slide.out, .slide.in { 777 -webkit-animation-timing-function: ease-out; 778 -webkit-animation-duration: 350ms; 779 -moz-animation-timing-function: ease-out; 780 -moz-animation-duration: 350ms; 781} 782.slide.out { 783 -webkit-transform: translateX(-100%); 784 -webkit-animation-name: slideouttoleft; 785 -moz-transform: translateX(-100%); 786 -moz-animation-name: slideouttoleft; 787} 788.slide.in { 789 -webkit-transform: translateX(0); 790 -webkit-animation-name: slideinfromright; 791 -moz-transform: translateX(0); 792 -moz-animation-name: slideinfromright; 793} 794.slide.out.reverse { 795 -webkit-transform: translateX(100%); 796 -webkit-animation-name: slideouttoright; 797 -moz-transform: translateX(100%); 798 -moz-animation-name: slideouttoright; 799} 800.slide.in.reverse { 801 -webkit-transform: translateX(0); 802 -webkit-animation-name: slideinfromleft; 803 -moz-transform: translateX(0); 804 -moz-animation-name: slideinfromleft; 805} 806.slidefade.out { 807 -webkit-transform: translateX(-100%); 808 -webkit-animation-name: slideouttoleft; 809 -moz-transform: translateX(-100%); 810 -moz-animation-name: slideouttoleft; 811 -webkit-animation-duration: 225ms; 812 -moz-animation-duration: 225ms; 813} 814.slidefade.in { 815 -webkit-transform: translateX(0); 816 -webkit-animation-name: fadein; 817 -moz-transform: translateX(0); 818 -moz-animation-name: fadein; 819 -webkit-animation-duration: 200ms; 820 -moz-animation-duration: 200ms; 821} 822.slidefade.out.reverse { 823 -webkit-transform: translateX(100%); 824 -webkit-animation-name: slideouttoright; 825 -moz-transform: translateX(100%); 826 -moz-animation-name: slideouttoright; 827 -webkit-animation-duration: 200ms; 828 -moz-animation-duration: 200ms; 829} 830.slidefade.in.reverse { 831 -webkit-transform: translateX(0); 832 -webkit-animation-name: fadein; 833 -moz-transform: translateX(0); 834 -moz-animation-name: fadein; 835 -webkit-animation-duration: 200ms; 836 -moz-animation-duration: 200ms; 837} 838/* slide down */ 839.slidedown.out { 840 -webkit-animation-name: fadeout; 841 -moz-animation-name: fadeout; 842 -webkit-animation-duration: 100ms; 843 -moz-animation-duration: 100ms; 844} 845.slidedown.in { 846 -webkit-transform: translateY(0); 847 -webkit-animation-name: slideinfromtop; 848 -moz-transform: translateY(0); 849 -moz-animation-name: slideinfromtop; 850 -webkit-animation-duration: 250ms; 851 -moz-animation-duration: 250ms; 852} 853.slidedown.in.reverse { 854 -webkit-animation-name: fadein; 855 -moz-animation-name: fadein; 856 -webkit-animation-duration: 150ms; 857 -moz-animation-duration: 150ms; 858} 859.slidedown.out.reverse { 860 -webkit-transform: translateY(-100%); 861 -moz-transform: translateY(-100%); 862 -webkit-animation-name: slideouttotop; 863 -moz-animation-name: slideouttotop; 864 -webkit-animation-duration: 200ms; 865 -moz-animation-duration: 200ms; 866} 867@-webkit-keyframes slideinfromtop { 868 from { -webkit-transform: translateY(-100%); } 869 to { -webkit-transform: translateY(0); } 870} 871@-moz-keyframes slideinfromtop { 872 from { -moz-transform: translateY(-100%); } 873 to { -moz-transform: translateY(0); } 874} 875@-webkit-keyframes slideouttotop { 876 from { -webkit-transform: translateY(0); } 877 to { -webkit-transform: translateY(-100%); } 878} 879@-moz-keyframes slideouttotop { 880 from { -moz-transform: translateY(0); } 881 to { -moz-transform: translateY(-100%); } 882} 883/* slide up */ 884.slideup.out { 885 -webkit-animation-name: fadeout; 886 -moz-animation-name: fadeout; 887 -webkit-animation-duration: 100ms; 888 -moz-animation-duration: 100ms; 889} 890.slideup.in { 891 -webkit-transform: translateY(0); 892 -webkit-animation-name: slideinfrombottom; 893 -moz-transform: translateY(0); 894 -moz-animation-name: slideinfrombottom; 895 -webkit-animation-duration: 250ms; 896 -moz-animation-duration: 250ms; 897} 898.slideup.in.reverse { 899 -webkit-animation-name: fadein; 900 -moz-animation-name: fadein; 901 -webkit-animation-duration: 150ms; 902 -moz-animation-duration: 150ms; 903} 904.slideup.out.reverse { 905 -webkit-transform: translateY(100%); 906 -moz-transform: translateY(100%); 907 -webkit-animation-name: slideouttobottom; 908 -moz-animation-name: slideouttobottom; 909 -webkit-animation-duration: 200ms; 910 -moz-animation-duration: 200ms; 911} 912@-webkit-keyframes slideinfrombottom { 913 from { -webkit-transform: translateY(100%); } 914 to { -webkit-transform: translateY(0); } 915} 916@-moz-keyframes slideinfrombottom { 917 from { -moz-transform: translateY(100%); } 918 to { -moz-transform: translateY(0); } 919} 920@-webkit-keyframes slideouttobottom { 921 from { -webkit-transform: translateY(0); } 922 to { -webkit-transform: translateY(100%); } 923} 924@-moz-keyframes slideouttobottom { 925 from { -moz-transform: translateY(0); } 926 to { -moz-transform: translateY(100%); } 927} 928/* The properties in this rule are only necessary for the 'flip' transition. 929 * We need specify the perspective to create a projection matrix. This will add 930 * some depth as the element flips. The depth number represents the distance of 931 * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate 932 * value. 933 */ 934.viewport-flip { 935 -webkit-perspective: 1000; 936 -moz-perspective: 1000; 937 position: absolute; 938} 939.flip { 940 -webkit-backface-visibility:hidden; 941 -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ 942 -moz-backface-visibility:hidden; 943 -moz-transform:translateX(0); 944} 945.flip.out { 946 -webkit-transform: rotateY(-90deg) scale(.9); 947 -webkit-animation-name: flipouttoleft; 948 -webkit-animation-duration: 175ms; 949 -moz-transform: rotateY(-90deg) scale(.9); 950 -moz-animation-name: flipouttoleft; 951 -moz-animation-duration: 175ms; 952} 953.flip.in { 954 -webkit-animation-name: flipintoright; 955 -webkit-animation-duration: 225ms; 956 -moz-animation-name: flipintoright; 957 -moz-animation-duration: 225ms; 958} 959.flip.out.reverse { 960 -webkit-transform: rotateY(90deg) scale(.9); 961 -webkit-animation-name: flipouttoright; 962 -moz-transform: rotateY(90deg) scale(.9); 963 -moz-animation-name: flipouttoright; 964} 965.flip.in.reverse { 966 -webkit-animation-name: flipintoleft; 967 -moz-animation-name: flipintoleft; 968} 969@-webkit-keyframes flipouttoleft { 970 from { -webkit-transform: rotateY(0); } 971 to { -webkit-transform: rotateY(-90deg) scale(.9); } 972} 973@-moz-keyframes flipouttoleft { 974 from { -moz-transform: rotateY(0); } 975 to { -moz-transform: rotateY(-90deg) scale(.9); } 976} 977@-webkit-keyframes flipouttoright { 978 from { -webkit-transform: rotateY(0) ; } 979 to { -webkit-transform: rotateY(90deg) scale(.9); } 980} 981@-moz-keyframes flipouttoright { 982 from { -moz-transform: rotateY(0); } 983 to { -moz-transform: rotateY(90deg) scale(.9); } 984} 985@-webkit-keyframes flipintoleft { 986 from { -webkit-transform: rotateY(-90deg) scale(.9); } 987 to { -webkit-transform: rotateY(0); } 988} 989@-moz-keyframes flipintoleft { 990 from { -moz-transform: rotateY(-90deg) scale(.9); } 991 to { -moz-transform: rotateY(0); } 992} 993@-webkit-keyframes flipintoright { 994 from { -webkit-transform: rotateY(90deg) scale(.9); } 995 to { -webkit-transform: rotateY(0); } 996} 997@-moz-keyframes flipintoright { 998 from { -moz-transform: rotateY(90deg) scale(.9); } 999 to { -moz-transform: rotateY(0); } 1000} 1001/* The properties in this rule are only necessary for the 'flip' transition. 1002 * We need specify the perspective to create a projection matrix. This will add 1003 * some depth as the element flips. The depth number represents the distance of 1004 * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate 1005 * value. 1006 */ 1007.viewport-turn { 1008 -webkit-perspective: 1000; 1009 -moz-perspective: 1000; 1010 position: absolute; 1011} 1012.turn { 1013 -webkit-backface-visibility:hidden; 1014 -webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ 1015 -webkit-transform-origin: 0; 1016 1017 -moz-backface-visibility:hidden; 1018 -moz-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */ 1019 -moz-transform-origin: 0; 1020} 1021.turn.out { 1022 -webkit-transform: rotateY(-90deg) scale(.9); 1023 -webkit-animation-name: flipouttoleft; 1024 -moz-transform: rotateY(-90deg) scale(.9); 1025 -moz-animation-name: flipouttoleft; 1026 -webkit-animation-duration: 125ms; 1027 -moz-animation-duration: 125ms; 1028} 1029.turn.in { 1030 -webkit-animation-name: flipintoright; 1031 -moz-animation-name: flipintoright; 1032 -webkit-animation-duration: 250ms; 1033 -moz-animation-duration: 250ms; 1034 1035} 1036.turn.out.reverse { 1037 -webkit-transform: rotateY(90deg) scale(.9); 1038 -webkit-animation-name: flipouttoright; 1039 -moz-transform: rotateY(90deg) scale(.9); 1040 -moz-animation-name: flipouttoright; 1041} 1042.turn.in.reverse { 1043 -webkit-animation-name: flipintoleft; 1044 -moz-animation-name: flipintoleft; 1045} 1046@-webkit-keyframes flipouttoleft { 1047 from { -webkit-transform: rotateY(0); } 1048 to { -webkit-transform: rotateY(-90deg) scale(.9); } 1049} 1050@-moz-keyframes flipouttoleft { 1051 from { -moz-transform: rotateY(0); } 1052 to { -moz-transform: rotateY(-90deg) scale(.9); } 1053} 1054@-webkit-keyframes flipouttoright { 1055 from { -webkit-transform: rotateY(0) ; } 1056 to { -webkit-transform: rotateY(90deg) scale(.9); } 1057} 1058@-moz-keyframes flipouttoright { 1059 from { -moz-transform: rotateY(0); } 1060 to { -moz-transform: rotateY(90deg) scale(.9); } 1061} 1062@-webkit-keyframes flipintoleft { 1063 from { -webkit-transform: rotateY(-90deg) scale(.9); } 1064 to { -webkit-transform: rotateY(0); } 1065} 1066@-moz-keyframes flipintoleft { 1067 from { -moz-transform: rotateY(-90deg) scale(.9); } 1068 to { -moz-transform: rotateY(0); } 1069} 1070@-webkit-keyframes flipintoright { 1071 from { -webkit-transform: rotateY(90deg) scale(.9); } 1072 to { -webkit-transform: rotateY(0); } 1073} 1074@-moz-keyframes flipintoright { 1075 from { -moz-transform: rotateY(90deg) scale(.9); } 1076 to { -moz-transform: rotateY(0); } 1077} 1078/* flow transition */ 1079.flow { 1080 -webkit-transform-origin: 50% 30%; 1081 -moz-transform-origin: 50% 30%; 1082 -webkit-box-shadow: 0 0 20px rgba(0,0,0,.4); 1083 -moz-box-shadow: 0 0 20px rgba(0,0,0,.4); 1084} 1085.ui-dialog.flow { 1086 -webkit-transform-origin: none; 1087 -moz-transform-origin: none; 1088 -webkit-box-shadow: none; 1089 -moz-box-shadow: none; 1090} 1091.flow.out { 1092 -webkit-transform: translateX(-100%) scale(.7); 1093 -webkit-animation-name: flowouttoleft; 1094 -webkit-animation-timing-function: ease; 1095 -webkit-animation-duration: 350ms; 1096 -moz-transform: translateX(-100%) scale(.7); 1097 -moz-animation-name: flowouttoleft; 1098 -moz-animation-timing-function: ease; 1099 -moz-animation-duration: 350ms; 1100} 1101.flow.in { 1102 -webkit-transform: translateX(0) scale(1); 1103 -webkit-animation-name: flowinfromright; 1104 -webkit-animation-timing-function: ease; 1105 -webkit-animation-duration: 350ms; 1106 -moz-transform: translateX(0) scale(1); 1107 -moz-animation-name: flowinfromright; 1108 -moz-animation-timing-function: ease; 1109 -moz-animation-duration: 350ms; 1110} 1111.flow.out.reverse { 1112 -webkit-transform: translateX(100%); 1113 -webkit-animation-name: flowouttoright; 1114 -moz-transform: translateX(100%); 1115 -moz-animation-name: flowouttoright; 1116} 1117.flow.in.reverse { 1118 -webkit-animation-name: flowinfromleft; 1119 -moz-animation-name: flowinfromleft; 1120} 1121@-webkit-keyframes flowouttoleft { 1122 0% { -webkit-transform: translateX(0) scale(1); } 1123 60%, 70% { -webkit-transform: translateX(0) scale(.7); } 1124 100% { -webkit-transform: translateX(-100%) scale(.7); } 1125} 1126@-moz-keyframes flowouttoleft { 1127 0% { -moz-transform: translateX(0) scale(1); } 1128 60%, 70% { -moz-transform: translateX(0) scale(.7); } 1129 100% { -moz-transform: translateX(-100%) scale(.7); } 1130} 1131@-webkit-keyframes flowouttoright { 1132 0% { -webkit-transform: translateX(0) scale(1); } 1133 60%, 70% { -webkit-transform: translateX(0) scale(.7); } 1134 100% { -webkit-transform: translateX(100%) scale(.7); } 1135} 1136@-moz-keyframes flowouttoright { 1137 0% { -moz-transform: translateX(0) scale(1); } 1138 60%, 70% { -moz-transform: translateX(0) scale(.7); } 1139 100% { -moz-transform: translateX(100%) scale(.7); } 1140} 1141@-webkit-keyframes flowinfromleft { 1142 0% { -webkit-transform: translateX(-100%) scale(.7); } 1143 30%, 40% { -webkit-transform: translateX(0) scale(.7); } 1144 100% { -webkit-transform: translateX(0) scale(1); } 1145} 1146@-moz-keyframes flowinfromleft { 1147 0% { -moz-transform: translateX(-100%) scale(.7); } 1148 30%, 40% { -moz-transform: translateX(0) scale(.7); } 1149 100% { -moz-transform: translateX(0) scale(1); } 1150} 1151@-webkit-keyframes flowinfromright { 1152 0% { -webkit-transform: translateX(100%) scale(.7); } 1153 30%, 40% { -webkit-transform: translateX(0) scale(.7); } 1154 100% { -webkit-transform: translateX(0) scale(1); } 1155} 1156@-moz-keyframes flowinfromright { 1157 0% { -moz-transform: translateX(100%) scale(.7); } 1158 30%, 40% { -moz-transform: translateX(0) scale(.7); } 1159 100% { -moz-transform: translateX(0) scale(1); } 1160} 1161/* content configurations. */ 1162.ui-grid-a, .ui-grid-b, .ui-grid-c, .ui-grid-d { overflow: hidden; } 1163.ui-block-a, .ui-block-b, .ui-block-c, .ui-block-d, .ui-block-e { margin: 0; padding: 0; border: 0; float: left; min-height: 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } 1164/* grid solo: 100 - single item fallback */ 1165.ui-grid-solo .ui-block-a { display: block; float: none; } 1166/* Lower percentages for older browsers (i.e. IE7) to prevent wrapping. -.5px to fix BB5 wrap issue. */ 1167/* grid a: 50/50 */ 1168.ui-grid-a .ui-block-a, .ui-grid-a .ui-block-b { width: 49.95%; } 1169.ui-grid-a > :nth-child(n) { width: 50%; margin-right: -.5px; } 1170.ui-grid-a .ui-block-a { clear: left; } 1171/* grid b: 33/33/33 */ 1172.ui-grid-b .ui-block-a, .ui-grid-b .ui-block-b, .ui-grid-b .ui-block-c { width: 33.25%; } 1173.ui-grid-b > :nth-child(n) { width: 33.333%; margin-right: -.5px; } 1174.ui-grid-b .ui-block-a { clear: left; } 1175/* grid c: 25/25/25/25 */ 1176.ui-grid-c .ui-block-a, .ui-grid-c .ui-block-b, .ui-grid-c .ui-block-c, .ui-grid-c .ui-block-d { width: 24.925%; } 1177.ui-grid-c > :nth-child(n) { width: 25%; margin-right: -.5px; } 1178.ui-grid-c .ui-block-a { clear: left; } 1179/* grid d: 20/20/20/20/20 */ 1180.ui-grid-d .ui-block-a, .ui-grid-d .ui-block-b, .ui-grid-d .ui-block-c, .ui-grid-d .ui-block-d, .ui-grid-d .ui-block-e { width: 19.925%; } 1181.ui-grid-d > :nth-child(n) { width: 20%; } 1182.ui-grid-d .ui-block-a { clear: left; } 1183/* fixed page header & footer configuration */ 1184.ui-header-fixed, 1185.ui-footer-fixed { 1186 left: 0; 1187 right: 0; 1188 width: 100%; 1189 position: fixed; 1190 z-index: 1000; 1191} 1192.ui-header-fixed { 1193 top: 0; 1194} 1195.ui-footer-fixed { 1196 bottom: 0; 1197} 1198.ui-header-fullscreen, 1199.ui-footer-fullscreen { 1200 filter: Alpha(Opacity=90); 1201 opacity: .9; 1202} 1203.ui-page-header-fixed { 1204 padding-top: 2.6875em; 1205} 1206.ui-page-footer-fixed { 1207 padding-bottom: 2.6875em; 1208} 1209.ui-page-header-fullscreen .ui-content, 1210.ui-page-footer-fullscreen .ui-content { 1211 padding: 0; 1212} 1213.ui-fixed-hidden { 1214 position: absolute; 1215} 1216.ui-page-header-fullscreen .ui-fixed-hidden, 1217.ui-page-footer-fullscreen .ui-fixed-hidden { 1218 left: -9999px; 1219} 1220.ui-header-fixed .ui-btn, 1221.ui-footer-fixed .ui-btn { 1222 z-index: 10; 1223} 1224.ui-navbar { max-width: 100%; } 1225.ui-navbar.ui-mini { margin: 0; } 1226.ui-navbar ul:before, .ui-navbar ul:after { content: " "; display: table; } 1227.ui-navbar ul:after { clear: both; } 1228.ui-navbar ul { list-style:none; margin: 0; padding: 0; position: relative; display: block; border: 0; max-width: 100%; overflow: visible; zoom: 1; } 1229.ui-navbar li .ui-btn { display: block; text-align: center; margin: 0 -1px 0 0; border-right-width: 0; } 1230.ui-navbar li .ui-btn-icon-right .ui-icon { right: 6px; } 1231/* add border if not in header/footer (full width) */ 1232.ui-navbar li:last-child .ui-btn, 1233.ui-navbar .ui-grid-duo .ui-block-b .ui-btn { margin-right: 0; border-right-width: 1px; } 1234.ui-header .ui-navbar li:last-child .ui-btn, 1235.ui-footer .ui-navbar li:last-child .ui-btn, 1236.ui-header .ui-navbar .ui-grid-duo .ui-block-b .ui-btn, 1237.ui-footer .ui-navbar .ui-grid-duo .ui-block-b .ui-btn { margin-right: -1px; border-right-width: 0; } 1238.ui-navbar .ui-grid-duo li.ui-block-a:last-child .ui-btn { margin-right: -1px; border-right-width: 1px; } 1239.ui-header .ui-navbar li .ui-btn, 1240.ui-footer .ui-navbar li .ui-btn { border-top-width: 0; border-bottom-width: 0; } 1241/* fixing gaps caused by subpixel problem */ 1242.ui-header .ui-navbar .ui-grid-b li.ui-block-c .ui-btn, 1243.ui-footer .ui-navbar .ui-grid-b li.ui-block-c .ui-btn { margin-right: -5px; } 1244.ui-header .ui-navbar .ui-grid-c li.ui-block-d .ui-btn, 1245.ui-footer .ui-navbar .ui-grid-c li.ui-block-d .ui-btn, 1246.ui-header .ui-navbar .ui-grid-d li.ui-block-e .ui-btn, 1247.ui-footer .ui-navbar .ui-grid-d li.ui-block-e .ui-btn { margin-right: -4px; } 1248.ui-header .ui-navbar .ui-grid-b li.ui-block-c .ui-btn-icon-right .ui-icon, 1249.ui-footer .ui-navbar .ui-grid-b li.ui-block-c .ui-btn-icon-right .ui-icon, 1250.ui-header .ui-navbar .ui-grid-c li.ui-block-d .ui-btn-icon-right .ui-icon, 1251.ui-footer .ui-navbar .ui-grid-c li.ui-block-d .ui-btn-icon-right .ui-icon, 1252.ui-header .ui-navbar .ui-grid-d li.ui-block-e .ui-btn-icon-right .ui-icon, 1253.ui-footer .ui-navbar .ui-grid-d li.ui-block-e .ui-btn-icon-right .ui-icon { right: 8px; } 1254.ui-navbar li .ui-btn .ui-btn-inner { padding-top: .7em; padding-bottom: .8em } 1255.ui-navbar li .ui-btn-icon-top .ui-btn-inner { padding-top: 30px; } 1256.ui-navbar li .ui-btn-icon-bottom .ui-btn-inner { padding-bottom: 30px; } 1257.ui-btn { display: block; text-align: center; cursor:pointer; position: relative; margin: .5em 0; padding: 0; } 1258.ui-mini { margin-top: .25em; margin-bottom: .25em; } 1259.ui-btn-left, .ui-btn-right, .ui-input-clear, .ui-btn-inline, 1260.ui-grid-a .ui-btn, .ui-grid-b .ui-btn, .ui-grid-c .ui-btn, .ui-grid-d .ui-btn, .ui-grid-e .ui-btn, .ui-grid-solo .ui-btn { margin-right: 5px; margin-left: 5px; } 1261.ui-btn-inner { font-size: 16px; padding: .6em 20px; min-width: .75em; display: block; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; zoom: 1; } 1262.ui-btn input, .ui-btn button { z-index: 2; } 1263.ui-btn-left, .ui-btn-right, .ui-btn-inline { display: inline-block; vertical-align: middle; } 1264.ui-mobile .ui-btn-left, .ui-mobile .ui-btn-right { margin: 0; } /* .ui-mobile to increase specificity level */ 1265.ui-btn-block { display: block; } 1266.ui-header > .ui-btn, 1267.ui-footer > .ui-btn { display: inline-block; margin: 0; } 1268.ui-header .ui-btn-block, 1269.ui-footer .ui-btn-block { display: block; } 1270.ui-header .ui-btn-inner, 1271.ui-footer .ui-btn-inner, 1272.ui-mini .ui-btn-inner { font-size: 12.5px; padding: .55em 11px .5em; } 1273.ui-fullsize .ui-btn-inner, 1274.ui-fullsize .ui-btn-inner { font-size: 16px; padding: .6em 20px; } 1275.ui-btn-icon-notext { width: 24px; height: 24px; } 1276.ui-btn-icon-notext .ui-btn-inner { padding: 0; height: 100%; } 1277.ui-btn-icon-notext .ui-btn-inner .ui-icon { margin: 2px 1px 2px 3px; float: left; } 1278.ui-btn-text { position: relative; z-index: 1; width: 100%; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; } 1279.ui-btn-icon-notext .ui-btn-text { position: absolute; left: -9999px; } 1280.ui-btn-icon-left .ui-btn-inner { padding-left: 40px; } 1281.ui-btn-icon-right .ui-btn-inner { padding-right: 40px; } 1282.ui-btn-icon-top .ui-btn-inner { padding-top: 40px; } 1283.ui-btn-icon-bottom .ui-btn-inner { padding-bottom: 40px; } 1284.ui-header .ui-btn-icon-left .ui-btn-inner, 1285.ui-footer .ui-btn-icon-left .ui-btn-inner, 1286.ui-mini.ui-btn-icon-left .ui-btn-inner, 1287.ui-mini .ui-btn-icon-left .ui-btn-inner { padding-left: 30px; } 1288.ui-header .ui-btn-icon-right .ui-btn-inner, 1289.ui-footer .ui-btn-icon-right .ui-btn-inner, 1290.ui-mini.ui-btn-icon-right .ui-btn-inner, 1291.ui-mini .ui-btn-icon-right .ui-btn-inner { padding-right: 30px; } 1292.ui-header .ui-btn-icon-top .ui-btn-inner, 1293.ui-footer .ui-btn-icon-top .ui-btn-inner { padding: 30px 3px .5em 3px; } 1294.ui-mini.ui-btn-icon-top .ui-btn-inner, 1295.ui-mini .ui-btn-icon-top .ui-btn-inner { padding-top: 30px; } 1296.ui-header .ui-btn-icon-bottom .ui-btn-inner, 1297.ui-footer .ui-btn-icon-bottom .ui-btn-inner { padding: .55em 3px 30px 3px; } 1298.ui-mini.ui-btn-icon-bottom .ui-btn-inner, 1299.ui-mini .ui-btn-icon-bottom .ui-btn-inner { padding-bottom: 30px; } 1300/*btn icon positioning*/ 1301.ui-btn-icon-notext .ui-icon { display: block; z-index: 0;} 1302.ui-btn-icon-left > .ui-btn-inner > .ui-icon, .ui-btn-icon-right > .ui-btn-inner > .ui-icon { position: absolute; top: 50%; margin-top: -9px; } 1303.ui-btn-icon-top .ui-btn-inner .ui-icon, .ui-btn-icon-bottom .ui-btn-inner .ui-icon { position: absolute; left: 50%; margin-left: -9px; } 1304.ui-btn-icon-left .ui-icon { left: 10px; } 1305.ui-btn-icon-right .ui-icon { right: 10px; } 1306.ui-btn-icon-top .ui-icon { top: 10px; } 1307.ui-btn-icon-bottom .ui-icon { top: auto; bottom: 10px; } 1308.ui-header .ui-btn-icon-left .ui-icon, 1309.ui-footer .ui-btn-icon-left .ui-icon, 1310.ui-mini.ui-btn-icon-left .ui-icon, 1311.ui-mini .ui-btn-icon-left .ui-icon { left: 5px; } 1312.ui-header .ui-btn-icon-right .ui-icon, 1313.ui-footer .ui-btn-icon-right .ui-icon, 1314.ui-mini.ui-btn-icon-right .ui-icon, 1315.ui-mini .ui-btn-icon-right .ui-icon { right: 5px; } 1316.ui-header .ui-btn-icon-top .ui-icon, 1317.ui-footer .ui-btn-icon-top .ui-icon, 1318.ui-mini.ui-btn-icon-top .ui-icon, 1319.ui-mini .ui-btn-icon-top .ui-icon { top: 5px; } 1320.ui-header .ui-btn-icon-bottom .ui-icon, 1321.ui-footer .ui-btn-icon-bottom .ui-icon, 1322.ui-mini.ui-btn-icon-bottom .ui-icon, 1323.ui-mini .ui-btn-icon-bottom .ui-icon { bottom: 5px; } 1324/*hiding native button,inputs */ 1325.ui-btn-hidden { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-appearance: none; cursor: pointer; background: #fff; background: rgba(255,255,255,0); filter: Alpha(Opacity=0); opacity: .1; font-size: 1px; border: none; text-indent: -9999px; } 1326/* Fixes IE/WP filter alpha opacity bugs */ 1327.ui-disabled .ui-btn-hidden { display: none; } 1328.ui-disabled { z-index: 1; } 1329.ui-field-contain .ui-btn.ui-submit { margin: 0; } 1330label.ui-submit { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .3em; display: block; } 1331@media all and (min-width: 450px){ 1332 .ui-field-contain label.ui-submit { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; } 1333 .ui-field-contain .ui-btn.ui-submit { width: 78%; display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } 1334 .ui-hide-label .ui-btn.ui-submit { width: auto; display: block; } 1335} 1336.ui-collapsible-inset { margin: .5em 0; } 1337.ui-collapsible-heading { font-size: 16px; display: block; margin: 0 -15px; padding: 0; position: relative; } 1338.ui-collapsible-inset .ui-collapsible-heading { margin: 0; } 1339.ui-collapsible-heading .ui-btn { text-align: left; margin: 0; border-left-width: 0; border-right-width: 0; } 1340.ui-collapsible-inset .ui-collapsible-heading .ui-btn { border-right-width: 1px; border-left-width: 1px; } 1341.ui-collapsible-collapsed + .ui-collapsible:not(.ui-collapsible-inset) .ui-collapsible-heading .ui-btn { border-top-width: 0; } 1342.ui-collapsible-set .ui-collapsible:not(.ui-collapsible-inset) .ui-collapsible-heading .ui-btn { border-top-width: 1px; } 1343.ui-collapsible-heading .ui-btn-inner, 1344.ui-collapsible-heading .ui-btn-icon-left .ui-btn-inner { padding-left: 40px; } 1345.ui-collapsible-heading .ui-btn-icon-right .ui-btn-inner { padding-left: 12px; padding-right: 40px; } 1346.ui-collapsible-heading .ui-btn-icon-top .ui-btn-inner, 1347.ui-collapsible-heading .ui-btn-icon-bottom .ui-btn-inner { padding-right: 40px; text-align: center; } 1348.ui-collapsible-heading .ui-btn span.ui-btn { position: absolute; left: 6px; top: 50%; margin: -12px 0 0 0; width: 20px; height: 20px; padding: 1px 0px 1px 2px; text-indent: -9999px; } 1349.ui-collapsible-heading .ui-btn span.ui-btn .ui-btn-inner { padding: 10px 0; } 1350.ui-collapsible-heading .ui-btn span.ui-btn .ui-icon { left: 0; margin-top: -10px; } 1351.ui-collapsible-heading-status { position: absolute; top: -9999px; left:0px; } 1352.ui-collapsible-content { 1353 display: block; 1354 margin: 0 -15px; 1355 padding: 10px 15px; 1356 border-left-width: 0; 1357 border-right-width: 0; 1358 border-top: none; /* Overrides ui-body-* */ 1359 background-image: none; /* Overrides ui-body-* */ 1360} 1361.ui-collapsible-inset .ui-collapsible-content { margin: 0; border-right-width: 1px; border-left-width: 1px; } 1362.ui-collapsible-content-collapsed { display: none; } 1363.ui-collapsible-set { margin: .5em 0; } 1364.ui-collapsible-set .ui-collapsible { margin: -1px 0 0; } 1365.ui-collapsible-set .ui-collapsible:first-child { margin-top: 0; } 1366.ui-controlgroup, fieldset.ui-controlgroup { padding: 0; margin: .5em 0; zoom: 1; } 1367.ui-controlgroup.ui-mini, fieldset.ui-controlgroup.ui-mini { margin: .25em 0; } 1368.ui-field-contain .ui-controlgroup, .ui-field-contain fieldset.ui-controlgroup { margin: 0; } 1369.ui-bar .ui-controlgroup { margin: 0 5px; } 1370.ui-controlgroup-label { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .4em; } 1371.ui-controlgroup li { list-style: none; } 1372.ui-controlgroup-vertical .ui-btn, 1373.ui-controlgroup-vertical .ui-checkbox, .ui-controlgroup-vertical .ui-radio { margin: 0; border-bottom-width: 0; } 1374.ui-controlgroup-vertical .ui-controlgroup-last { border-bottom-width: 1px; } 1375.ui-controlgroup-controls label.ui-select { position: absolute; left: -9999px; } 1376.ui-controlgroup .ui-btn-icon-notext { width: auto; height: auto; top: auto; } 1377.ui-controlgroup .ui-btn-icon-notext .ui-btn-inner { height: 20px; padding: .6em 20px .6em 20px } 1378.ui-controlgroup-horizontal .ui-btn-icon-notext .ui-btn-inner { width: 18px; } 1379.ui-controlgroup.ui-mini .ui-btn-icon-notext .ui-btn-inner, 1380.ui-header .ui-controlgroup .ui-btn-icon-notext .ui-btn-inner, 1381.ui-footer .ui-controlgroup .ui-btn-icon-notext .ui-btn-inner { height: 16px; padding: .55em 11px .5em 11px; } 1382.ui-controlgroup .ui-btn-icon-notext .ui-btn-inner .ui-icon { position: absolute; top: 50%; right: 50%; margin: -9px -9px 0 0; } 1383.ui-controlgroup-horizontal .ui-controlgroup-controls:before, 1384.ui-controlgroup-horizontal .ui-controlgroup-controls:after { content: ""; display: table; } 1385.ui-controlgroup-horizontal .ui-controlgroup-controls:after { clear: both; } 1386.ui-controlgroup-horizontal .ui-controlgroup-controls { display: inline-block; vertical-align: middle; zoom: 1; } 1387.ui-controlgroup-horizontal .ui-btn-inner { text-align: center; } 1388.ui-controlgroup-horizontal.ui-mini .ui-btn-inner { height: 16px; line-height: 16px; } 1389.ui-controlgroup-horizontal .ui-btn, .ui-controlgroup-horizontal .ui-select, 1390.ui-controlgroup-horizontal .ui-checkbox, .ui-controlgroup-horizontal .ui-radio { float: left; clear: none; margin: 0 -1px 0 0; } 1391.ui-controlgroup-horizontal .ui-select .ui-btn, 1392.ui-controlgroup-horizontal .ui-checkbox .ui-btn, .ui-controlgroup-horizontal .ui-radio .ui-btn { float: none; margin: 0; } 1393.ui-controlgroup-horizontal .ui-controlgroup-last, .ui-controlgroup-horizontal .ui-select:last-child, 1394.ui-controlgroup-horizontal .ui-checkbox:last-child, .ui-controlgroup-horizontal .ui-radio:last-child { margin-right: 0; } 1395.ui-controlgroup .ui-checkbox label, .ui-controlgroup .ui-radio label { font-size: 16px; } 1396@media all and (min-width: 450px){ 1397 .ui-field-contain .ui-controlgroup-label { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; } 1398 .ui-field-contain .ui-controlgroup-controls { width: 78%; display: inline-block; } 1399 .ui-field-contain .ui-controlgroup .ui-select { width: 100%; display: block; } 1400 .ui-field-contain .ui-controlgroup-horizontal .ui-select { width: auto; } 1401 .ui-hide-label .ui-controlgroup-controls { width: 100%; } 1402} 1403.ui-dialog { 1404 background: none !important; /* this is to ensure that dialog theming does not apply (by default at least) on the page div */ 1405} 1406.ui-dialog-contain { 1407 width: 92.5%; 1408 max-width: 500px; 1409 margin: 10% auto 15px auto; 1410 padding: 0; 1411 position: relative; 1412 top: -15px; 1413} 1414.ui-dialog-contain > .ui-header, 1415.ui-dialog-contain > .ui-content, 1416.ui-dialog-contain > .ui-footer { 1417 display: block; 1418 position: relative; 1419 width: auto; 1420 margin: 0; 1421} 1422.ui-dialog-contain > .ui-header { 1423 border: none; 1424 overflow: hidden; 1425 z-index: 10; 1426 padding: 0; 1427} 1428.ui-dialog-contain > .ui-content { 1429 padding: 15px; 1430} 1431.ui-dialog-contain > .ui-footer { 1432 z-index: 10; 1433 padding: 0 15px; 1434} 1435.ui-popup-open .ui-header-fixed, 1436.ui-popup-open .ui-footer-fixed { 1437 position: absolute !important; /* See line #553 of popup.js */ 1438} 1439.ui-popup-screen { 1440 background-image: url(data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==); /* Necessary to set some form of background to ensure element is clickable in IE6/7. While legacy IE won't understand the data-URI'd image, it ensures no additional requests occur in all other browsers with little overhead. */ 1441 top: 0px; 1442 left: 0px; 1443 right: 0px; 1444 bottom: 1px; 1445 position: absolute; 1446 filter: Alpha(Opacity=0); 1447 opacity: 0; 1448 z-index: 1099; 1449} 1450.ui-popup-screen.in { 1451 opacity: 0.5; 1452 filter: Alpha(Opacity=50); 1453} 1454.ui-popup-screen.out { 1455 opacity: 0; 1456 filter: Alpha(Opacity=0); 1457} 1458.ui-popup-container { 1459 z-index: 1100; 1460 display: inline-block; 1461 position: absolute; 1462 padding: 0; 1463 outline: 0; 1464} 1465.ui-popup { 1466 position: relative; 1467} 1468.ui-popup.ui-content, 1469.ui-popup .ui-content { 1470 overflow: visible; 1471} 1472.ui-popup > p, 1473.ui-popup > h1, 1474.ui-popup > h2, 1475.ui-popup > h3, 1476.ui-popup > h4, 1477.ui-popup > h5, 1478.ui-popup > h6 { 1479 margin: .5em 7px; 1480} 1481.ui-popup > span { 1482 display: block; 1483 margin: .5em 7px; 1484} 1485.ui-popup .ui-title { 1486 font-size: 16px; 1487 font-weight: bold; 1488 margin-top: .5em; 1489 margin-bottom: .5em; 1490} 1491.ui-popup-container .ui-content > p, 1492.ui-popup-container .ui-content > h1, 1493.ui-popup-container .ui-content > h2, 1494.ui-popup-container .ui-content > h3, 1495.ui-popup-container .ui-content > h4, 1496.ui-popup-container .ui-content > h5, 1497.ui-popup-container .ui-content > h6 { 1498 margin: .5em 0; 1499} 1500.ui-popup-container .ui-content > span { 1501 margin: 0; 1502} 1503.ui-popup-container .ui-content > p:first-child, 1504.ui-popup-container .ui-content > h1:first-child, 1505.ui-popup-container .ui-content > h2:first-child, 1506.ui-popup-container .ui-content > h3:first-child, 1507.ui-popup-container .ui-content > h4:first-child, 1508.ui-popup-container .ui-content > h5:first-child, 1509.ui-popup-container .ui-content > h6:first-child { 1510 margin-top: 0; 1511} 1512.ui-popup-container .ui-content > p:last-child, 1513.ui-popup-container .ui-content > h1:last-child, 1514.ui-popup-container .ui-content > h2:last-child, 1515.ui-popup-container .ui-content > h3:last-child, 1516.ui-popup-container .ui-content > h4:last-child, 1517.ui-popup-container .ui-content > h5:last-child, 1518.ui-popup-container .ui-content > h6:last-child { 1519 margin-bottom: 0; 1520} 1521.ui-popup > img { 1522 width: auto; 1523 height: auto; 1524 max-width: 100%; 1525 max-height: 100%; 1526 vertical-align: middle; 1527} 1528.ui-popup iframe { 1529 vertical-align: middle; 1530} 1531@media all and (min-width: 450px){ 1532 .ui-popup .ui-field-contain label.ui-submit, 1533 .ui-popup .ui-field-contain .ui-controlgroup-label, 1534 .ui-popup .ui-field-contain label.ui-select, 1535 .ui-popup .ui-field-contain label.ui-input-text { 1536 font-size: 16px; line-height: 1.4; display: block; font-weight: normal; margin: 0 0 .3em; 1537 } 1538 .ui-popup .ui-field-contain .ui-btn.ui-submit, 1539 .ui-popup .ui-field-contain .ui-controlgroup-controls, 1540 .ui-popup .ui-field-contain .ui-select, 1541 .ui-popup .ui-field-contain input.ui-input-text, 1542 .ui-popup .ui-field-contain textarea.ui-input-text, 1543 .ui-popup .ui-field-contain .ui-input-search { 1544 width: 100%; display: block; 1545 } 1546} 1547.ui-popup > .ui-btn-left, 1548.ui-popup > .ui-btn-right { 1549 position: absolute; 1550 top: -9px; 1551 margin: 0; 1552 z-index: 1101; 1553} 1554.ui-popup > .ui-btn-left { left: -9px; } 1555.ui-popup > .ui-btn-right { right: -9px; } 1556.ui-popup.ui-corner-all > .ui-header, 1557.ui-popup.ui-corner-all ~ .ui-content, 1558.ui-popup.ui-corner-all > .ui-content:first-child { 1559 -webkit-border-top-left-radius: inherit; 1560 border-top-left-radius: inherit; 1561 -webkit-border-top-right-radius: inherit; 1562 border-top-right-radius: inherit; 1563} 1564.ui-popup.ui-corner-all > .ui-content, 1565.ui-popup.ui-corner-all > .ui-footer, 1566.ui-popup.ui-corner-all > .ui-header:nth-child(n):last-child { 1567 -webkit-border-bottom-left-radius: inherit; 1568 border-bottom-left-radius: inherit; 1569 -webkit-border-bottom-right-radius: inherit; 1570 border-bottom-right-radius: inherit; 1571} 1572.ui-popup.ui-corner-all > .ui-content:nth-child(2), 1573.ui-popup.ui-corner-all > .ui-header:nth-child(2) { 1574 -webkit-border-top-left-radius: 0; 1575 border-top-left-radius: 0; 1576 -webkit-border-top-right-radius: 0; 1577 border-top-right-radius: 0; 1578} 1579.ui-popup.ui-corner-all > .ui-content:nth-last-child(1n+2), 1580.ui-popup.ui-corner-all > .ui-footer:nth-last-child(1n+2) { 1581 -webkit-border-bottom-left-radius: 0; 1582 border-bottom-left-radius: 0; 1583 -webkit-border-bottom-right-radius: 0; 1584 border-bottom-right-radius: 0; 1585} 1586.ui-popup.ui-corner-all > .ui-header:only-child, 1587.ui-popup.ui-corner-all > .ui-footer:only-child { 1588 -webkit-border-radius: inherit; 1589 border-radius: inherit; 1590} 1591.ui-checkbox, .ui-radio { position: relative; clear: both; margin: 0; z-index: 1; } 1592.ui-checkbox .ui-btn, .ui-radio .ui-btn { margin-top: .5em; margin-bottom: .5em; text-align: left; z-index: 2; } 1593.ui-checkbox .ui-btn.ui-mini, .ui-radio .ui-btn.ui-mini { margin: .25em 0; } 1594.ui-controlgroup .ui-checkbox .ui-btn, .ui-controlgroup .ui-radio .ui-btn { margin: 0; } 1595.ui-checkbox .ui-btn-inner, .ui-radio .ui-btn-inner { white-space: normal; } 1596.ui-checkbox .ui-btn-icon-left .ui-btn-inner,.ui-radio .ui-btn-icon-left .ui-btn-inner { padding-left: 45px; } 1597.ui-checkbox .ui-mini.ui-btn-icon-left .ui-btn-inner,.ui-radio .ui-mini.ui-btn-icon-left .ui-btn-inner { padding-left: 36px; } 1598.ui-checkbox .ui-btn-icon-right .ui-btn-inner, .ui-radio .ui-btn-icon-right .ui-btn-inner { padding-right: 45px; } 1599.ui-checkbox .ui-mini.ui-btn-icon-right .ui-btn-inner, .ui-radio .ui-mini.ui-btn-icon-right .ui-btn-inner { padding-right: 36px; } 1600.ui-checkbox .ui-btn-icon-top .ui-btn-inner,.ui-radio .ui-btn-icon-top .ui-btn-inner { padding-right: 0; padding-left: 0; text-align: center; } 1601.ui-checkbox .ui-btn-icon-bottom .ui-btn-inner, .ui-radio .ui-btn-icon-bottom .ui-btn-inner { padding-right: 0; padding-left: 0; text-align: center; } 1602.ui-checkbox .ui-icon, .ui-radio .ui-icon { top: 1.1em; } 1603.ui-checkbox .ui-btn-icon-left .ui-icon, .ui-radio .ui-btn-icon-left .ui-icon { left: 15px; } 1604.ui-checkbox .ui-mini.ui-btn-icon-left .ui-icon, .ui-radio .ui-mini.ui-btn-icon-left .ui-icon { left: 9px; } 1605.ui-checkbox .ui-btn-icon-right .ui-icon, .ui-radio .ui-btn-icon-right .ui-icon { right: 15px; } 1606.ui-checkbox .ui-mini.ui-btn-icon-right .ui-icon, .ui-radio .ui-mini.ui-btn-icon-right .ui-icon { right: 9px; } 1607.ui-checkbox .ui-btn-icon-top .ui-icon, .ui-radio .ui-btn-icon-top .ui-icon { top: 10px; } 1608.ui-checkbox .ui-btn-icon-bottom .ui-icon, .ui-radio .ui-btn-icon-bottom .ui-icon { top: auto; bottom: 10px; } 1609.ui-checkbox .ui-btn-icon-right .ui-icon, .ui-radio .ui-btn-icon-right .ui-icon { right: 15px; } 1610.ui-checkbox .ui-mini.ui-btn-icon-right .ui-icon, .ui-radio .ui-mini.ui-btn-icon-right .ui-icon { right: 9px; } 1611/* input, label positioning */ 1612.ui-checkbox input,.ui-radio input { position:absolute; left:20px; top:50%; width: 10px; height: 10px; margin:-5px 0 0 0; outline: 0 !important; z-index: 1; } 1613.ui-field-contain, fieldset.ui-field-contain { padding: .8em 0; margin: 0; border-width: 0 0 1px 0; overflow: visible; } 1614.ui-field-contain:last-child { border-bottom-width: 0; } 1615.ui-field-contain { max-width: 100%; } /* This prevents horizontal scrollbar in IE7 */ 1616@media all and (min-width: 450px){ 1617 .ui-field-contain, .ui-mobile fieldset.ui-field-contain { border-width: 0; padding: 0; margin: 1em 0; } 1618} 1619.ui-select { display: block; position: relative; } 1620.ui-select select { position: absolute; left: -9999px; top: -9999px; } 1621.ui-select .ui-btn { overflow: hidden; opacity: 1; } 1622.ui-field-contain .ui-select .ui-btn { margin: 0; } 1623/* Fixes #2588: When Windows Phone 7.5 (Mango) tries to calculate a numeric opacity for a select (including "inherit") without explicitly specifying an opacity on the parent to give it context, a bug appears where clicking elsewhere on the page after opening the select will open the select again. */ 1624.ui-select .ui-btn select { cursor: pointer; -webkit-appearance: none; left: 0; top:0; width: 100%; min-height: 1.5em; min-height: 100%; height: 3em; max-height: 100%; filter: Alpha(Opacity=0); opacity: 0; z-index: 2; } 1625.ui-select .ui-disabled { opacity: .3; } 1626/* Display none because of issues with IE/WP's filter alpha opacity */ 1627.ui-select .ui-disabled select { display: none; } 1628@-moz-document url-prefix() { .ui-select .ui-btn select { opacity: 0.0001; }} 1629.ui-select .ui-btn.ui-select-nativeonly { border-radius: 0; border: 0; } 1630.ui-select .ui-btn.ui-select-nativeonly select { opacity: 1; text-indent: 0; display: block; } 1631.ui-select .ui-disabled.ui-select-nativeonly .ui-btn-inner { opacity: 0; } 1632.ui-select .ui-btn-icon-right .ui-btn-inner, .ui-select .ui-li-has-count .ui-btn-inner { padding-right: 45px; } 1633.ui-select .ui-mini.ui-btn-icon-right .ui-btn-inner { padding-right: 32px; } 1634.ui-select .ui-btn-icon-right.ui-li-has-count .ui-btn-inner { padding-right: 80px; } 1635.ui-select .ui-mini.ui-btn-icon-right.ui-li-has-count .ui-btn-inner { padding-right: 67px; } 1636.ui-select .ui-btn-icon-right .ui-icon { right: 15px; } 1637.ui-select .ui-mini.ui-btn-icon-right .ui-icon { right: 7px; } 1638.ui-select .ui-btn-icon-right.ui-li-has-count .ui-li-count { right: 45px; } 1639.ui-select .ui-mini.ui-btn-icon-right.ui-li-has-count .ui-li-count { right: 32px; } 1640/* labels */ 1641label.ui-select { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .3em; display: block; } 1642/*listbox*/ 1643.ui-select .ui-btn-text, .ui-selectmenu .ui-btn-text { display: block; min-height: 1em; overflow: hidden !important; 1644/* This !important is required for iPad Safari specifically. See https://github.com/jquery/jquery-mobile/issues/2647 */ } 1645.ui-select .ui-btn-text { text-overflow: ellipsis; } 1646.ui-selectmenu { padding: 6px; min-width: 160px; } 1647.ui-selectmenu .ui-listview { margin: 0; } 1648.ui-selectmenu .ui-btn.ui-li-divider { cursor: default; } 1649.ui-selectmenu-hidden { top: -99999px; left: -9999px; } 1650.ui-screen-hidden, .ui-selectmenu-list .ui-li .ui-icon { display: none; } 1651.ui-selectmenu-list .ui-li .ui-icon { display: block; } 1652.ui-li.ui-selectmenu-placeholder { display: none; } 1653.ui-selectmenu .ui-header { margin: 0; padding: 0; } 1654.ui-selectmenu .ui-header .ui-title { margin: 0.6em 46px 0.8em; } 1655@media all and (min-width: 450px){ 1656 .ui-field-contain label.ui-select { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; } 1657 .ui-field-contain .ui-select { width: 78%; display: inline-block; } 1658 .ui-hide-label .ui-select { width: 100%; } 1659} 1660/* when no placeholder is defined in a multiple select, the header height doesn't even extend past the close button. this shim's content in there */ 1661.ui-selectmenu .ui-header h1:after { content: '.'; visibility: hidden; } 1662label.ui-input-text { font-size: 16px; line-height: 1.4; display: block; font-weight: normal; margin: 0 0 .3em; } 1663input.ui-input-text, textarea.ui-input-text { background-image: none; padding: .4em; margin: .5em 0; line-height: 1.4; font-size: 16px; display: block; width: 100%; outline: 0; } 1664input.ui-input-text.ui-mini, textarea.ui-input-text.ui-mini { margin: .25em 0; } 1665.ui-field-contain input.ui-input-text, .ui-field-contain textarea.ui-input-text { margin: 0; } 1666input.ui-input-text, textarea.ui-input-text, .ui-input-search { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } 1667input.ui-input-text { -webkit-appearance: none; } 1668textarea.ui-input-text { height: 50px; -webkit-transition: height 200ms linear; -moz-transition: height 200ms linear; -o-transition: height 200ms linear; transition: height 200ms linear; } 1669.ui-input-search { padding: 0 30px; margin: .5em 0; background-image: none; position: relative; } 1670.ui-input-search.ui-mini { margin: .25em 0; } 1671.ui-field-contain .ui-input-search { margin: 0; } 1672.ui-icon-searchfield:after { position: absolute; left: 7px; top: 50%; margin-top: -9px; content: ""; width: 18px; height: 18px; opacity: .5; } 1673.ui-input-search input.ui-input-text { border: none; width: 98%; padding: .4em 0; margin: 0; display: block; background: transparent none; outline: 0 !important; } 1674.ui-input-search .ui-input-clear { position: absolute; right: 0; top: 50%; margin-top: -13px; } 1675.ui-mini .ui-input-clear { right: -3px; } 1676.ui-input-search .ui-input-clear-hidden { display: none; } 1677input.ui-mini, .ui-mini input, textarea.ui-mini { font-size: 14px; } 1678textarea.ui-mini { height: 45px; } 1679@media all and (min-width: 450px){ 1680 .ui-field-contain label.ui-input-text { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0 } 1681 .ui-field-contain input.ui-input-text, 1682 .ui-field-contain textarea.ui-input-text, 1683 .ui-field-contain .ui-input-search { width: 78%; display: inline-block; } 1684 .ui-hide-label input.ui-input-text, 1685 .ui-hide-label textarea.ui-input-text, 1686 .ui-hide-label .ui-input-search { width: 100%; } 1687 .ui-input-search input.ui-input-text { width: 98%; /*echos rule from above*/ } 1688} 1689.ui-listview { margin: 0; } 1690ol.ui-listview, ol.ui-listview .ui-li-divider { counter-reset: listnumbering; } 1691.ui-content .ui-listview { margin: -15px; } 1692.ui-collapsible-content > .ui-listview { margin: -10px -15px; } 1693.ui-content .ui-listview-inset { margin: 1em 0; } 1694.ui-collapsible-content .ui-listview-inset { margin: .5em 0; } 1695.ui-listview, .ui-li { list-style:none; padding:0; } 1696.ui-li, .ui-li.ui-field-contain { display: block; margin:0; position: relative; overflow: visible; text-align: left; border-width: 0; border-top-width: 1px; } 1697.ui-li.ui-btn { margin: 0; } 1698.ui-li .ui-btn-text a.ui-link-inherit { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } 1699.ui-li-static { background-image: none; } 1700.ui-li-divider { padding: .5em 15px; font-size: 14px; font-weight: bold; } 1701ol.ui-listview .ui-link-inherit:before, ol.ui-listview .ui-li-static:before, .ui-li-dec { font-size: .8em; display: inline-block; padding-right: .3em; font-weight: normal; counter-increment: listnumbering; content: counter(listnumbering) ". "; } 1702ol.ui-listview .ui-li-jsnumbering:before { content: "" !important; } /* to avoid chance of duplication */ 1703.ui-listview-inset .ui-li { border-right-width: 1px; border-left-width: 1px; } 1704.ui-li-last, .ui-li.ui-field-contain.ui-li-last { border-bottom-width: 1px; } 1705.ui-collapsible [class*="ui-body"] > .ui-listview:not(.ui-listview-inset) .ui-li-last { border-bottom-width: 0; } 1706.ui-collapsible-content > .ui-listview:not(.ui-listview-inset) .ui-li:first-child { border-top-width: 0; } 1707.ui-collapsible-content > .ui-listview:not(.ui-listview-inset), 1708.ui-collapsible-content > .ui-listview:not(.ui-listview-inset) .ui-li-last { -webkit-border-bottom-left-radius: inherit; -webkit-border-bottom-right-radius: inherit; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } 1709.ui-collapsible-content > .ui-listview:not(.ui-listview-inset) .ui-li-last .ui-li-link-alt { -webkit-border-bottom-right-radius: inherit; border-bottom-right-radius: inherit; } 1710.ui-li>.ui-btn-inner { display: block; position: relative; padding: 0; } 1711.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li { padding: .7em 15px; display: block; } 1712.ui-li-has-thumb .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-thumb { min-height: 60px; padding-left: 100px; } 1713.ui-li-has-icon .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-icon { min-height: 20px; padding-left: 40px; } 1714.ui-li-has-count .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-count, .ui-li-divider.ui-li-has-count { padding-right: 45px; } 1715.ui-li-has-arrow .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-arrow { padding-right: 40px; } 1716.ui-li-has-arrow.ui-li-has-count .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-arrow.ui-li-has-count { padding-right: 75px; } 1717.ui-li-heading { font-size: 16px; font-weight: bold; display: block; margin: .6em 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } 1718.ui-li-desc { font-size: 12px; font-weight: normal; display: block; margin: -.5em 0 .6em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } 1719.ui-li-thumb, .ui-listview .ui-li-icon { position: absolute; left: 1px; top: 0; max-height: 80px; max-width: 80px; } 1720.ui-listview .ui-li-icon { max-height: 16px; max-width: 16px; left: 10px; top: .9em; } 1721.ui-li-thumb, .ui-listview .ui-li-icon, .ui-li-content { float: left; margin-right: 10px; } 1722.ui-li-aside { float: right; width: 50%; text-align: right; margin: .3em 0; } 1723@media all and (min-width: 480px){ 1724 .ui-li-aside { width: 45%; } 1725} 1726.ui-li-divider { cursor: default; } 1727.ui-li-has-alt .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-alt { padding-right: 53px; } 1728.ui-li-has-alt.ui-li-has-count .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-alt.ui-li-has-count { padding-right: 88px; } 1729.ui-li-has-count .ui-li-count { position: absolute; font-size: 11px; font-weight: bold; padding: .2em .5em; top: 50%; margin-top: -.9em; right: 10px; } 1730.ui-li-has-count.ui-li-divider .ui-li-count, .ui-li-has-count .ui-link-inherit .ui-li-count { margin-top: -.95em; } 1731.ui-li-has-arrow.ui-li-has-count .ui-li-count { right: 40px; } 1732.ui-li-has-alt.ui-li-has-count .ui-li-count { right: 53px; } 1733.ui-li-link-alt { position: absolute; width: 40px; height: 100%; border-width: 0; border-left-width: 1px; top: 0; right: 0; margin: 0; padding: 0; z-index: 2; } 1734.ui-li-link-alt .ui-btn { overflow: hidden; position: absolute; right: 8px; top: 50%; margin: -13px 0 0 0; border-bottom-width: 1px; z-index: -1;} 1735.ui-li-link-alt .ui-btn-inner { padding: 0; height: 100%; position: absolute; width: 100%; top: 0; left: 0;} 1736.ui-li-link-alt .ui-btn .ui-icon { right: 50%; margin-right: -9px; } 1737.ui-li-link-alt .ui-btn-icon-notext .ui-btn-inner .ui-icon { position: absolute; top: 50%; margin-top: -9px; } 1738.ui-listview * .ui-btn-inner > .ui-btn > .ui-btn-inner { border-top: 0px; } 1739.ui-listview-filter { border-width: 0; overflow: hidden; margin: -15px -15px 15px -15px; } 1740.ui-collapsible-content .ui-listview-filter { margin: -10px -15px 10px -15px; border-bottom: inherit; } 1741.ui-listview-filter-inset { margin: -15px -5px; background: transparent; } 1742.ui-collapsible-content .ui-listview-filter-inset { margin: -5px; border-bottom-width: 0; } 1743.ui-listview-filter .ui-input-search { margin: 5px; width: auto; display: block; } 1744.ui-li.ui-screen-hidden{ display:none; } 1745/* Odd iPad positioning issue. */ 1746@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) { 1747 .ui-li .ui-btn-text { overflow: visible; } 1748} 1749label.ui-slider { font-size: 16px; line-height: 1.4; font-weight: normal; margin: 0 0 .3em; display: block; } 1750input.ui-slider-input, 1751.ui-field-contain input.ui-slider-input { display: inline-block; width: 50px; background-image: none; padding: .4em; margin: .5em 0; line-height: 1.4; font-size: 16px; outline: 0; } 1752input.ui-slider-input.ui-mini, 1753.ui-field-contain input.ui-slider-input.ui-mini { width: 45px; margin: .25em 0; font-size: 14px; } 1754.ui-field-contain input.ui-slider-input { margin: 0; } 1755input.ui-slider-input, .ui-field-contain input.ui-slider-input { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; -ms-box-sizing: content-box; box-sizing: content-box; } 1756/* Fixes input fields being to small on Safari/Mac because of the up and down arrows. */ 1757.ui-slider-input::-webkit-outer-spin-button { margin: 0; } 1758select.ui-slider-switch { display: none; } 1759div.ui-slider { position: relative; display: inline-block; overflow: visible; height: 15px; padding: 0; margin: 0 2% 0 20px; top: 4px; width: 65%; } 1760div.ui-slider-mini { height: 12px; margin-left: 10px; top: 2px; } 1761div.ui-slider-bg { border: none; height: 100%; padding-right: 8px; } 1762.ui-controlgroup a.ui-slider-handle, a.ui-btn.ui-slider-handle { position: absolute; z-index: 1; top: 50%; width: 28px; height: 28px; margin: -15px 0 0 -15px; outline: 0; } 1763a.ui-btn.ui-slider-handle .ui-btn-inner { padding: 0; height: 100%; } 1764div.ui-slider-mini a.ui-slider-handle { height: 14px; width: 14px; margin: -8px 0 0 -7px; } 1765div.ui-slider-mini a.ui-slider-handle .ui-btn-inner { height: 30px; width: 30px; padding: 0; margin: -9px 0 0 -9px; border-top: none; } 1766@media all and (min-width: 450px){ 1767 .ui-field-contain label.ui-slider { vertical-align: top; display: inline-block; width: 20%; margin: 0 2% 0 0; } 1768 .ui-field-contain div.ui-slider { width: 43%; } 1769 .ui-field-contain div.ui-slider-switch { width: 5.5em; } 1770} 1771div.ui-slider-switch { height: 32px; margin-left: 0; width: 5.8em; } 1772a.ui-slider-handle-snapping { -webkit-transition: left 70ms linear; -moz-transition: left 70ms linear; } 1773div.ui-slider-switch .ui-slider-handle { margin: 1px 0 0 -15px; } 1774.ui-slider-inneroffset { margin: 0 16px; position: relative; z-index: 1; } 1775div.ui-slider-switch.ui-slider-mini { width: 5em; height: 29px; } 1776div.ui-slider-switch.ui-slider-mini .ui-slider-inneroffset { margin: 0 15px 0 14px; } 1777div.ui-slider-switch.ui-slider-mini .ui-slider-handle { width: 25px; height: 25px; margin: 1px 0 0 -13px; } 1778div.ui-slider-switch.ui-slider-mini a.ui-slider-handle .ui-btn-inner { height: 30px; width: 30px; padding: 0; margin: 0; } 1779span.ui-slider-label { position: absolute; text-align: center; width: 100%; overflow: hidden; font-size: 16px; top: 0; line-height: 2; min-height: 100%; border-width: 0; white-space: nowrap; } 1780.ui-slider-mini span.ui-slider-label { font-size: 14px; } 1781span.ui-slider-label-a { z-index: 1; left: 0; text-indent: -1.5em; } 1782span.ui-slider-label-b { z-index: 0; right: 0; text-indent: 1.5em;} 1783.ui-slider-inline { width: 120px; display: inline-block; } 1784 1785/* Customize UI 1786-----------------------------------------------------------------------------------------------------------*/ 1787.sicon, .bicon, .ui-icon-cloud-home, .ui-icon-cloud-refresh, .ui-icon-cloud-setting, 1788.ui-icon-cloud-share, .ui-icon-cloud-arrow-r, .ui-icon-cloud-delete, .ui-icon-cloud-rename, 1789.ui-icon-cloud-select, .ui-icon-cloud-logout { 1790background:transparent url("style-theme1.app.png") no-repeat top left; 1791} 1792 1793.bicon{ 1794width:60px; 1795height:60px; 1796} 1797 1798.sicon { 1799width:40px; 1800height:40px; 1801} 1802 1803.ui-header{ 1804height:80px; 1805} 1806 1807.ui-header #light{ 1808position: absolute; 1809left: 10px; 1810top: 20px; 1811width:8px; 1812height:30px; 1813background-color:#7ED3F6; 1814} 1815 1816.ui-header #title-logo{ 1817position: absolute; 1818left: 30px; 1819top: 20px; 1820font-size: 24px; 1821} 1822 1823.ui-header #title-welcome{ 1824position: absolute; 1825left: 30px; 1826top: 50px; 1827font-size: 12px; 1828} 1829 1830.ui-header #options{ 1831float:right; 1832height:100%; 1833} 1834 1835.ui-btn-parent{ 1836height: 45px; 1837background-color:#000; 1838cursor:pointer; 1839} 1840 1841.ui-btn-parent span{ 1842position: absolute; 1843left: 35px; 1844top: 10px; 1845} 1846 1847.ui-icon-cloud-home { 1848background-position: 0 -134px; 1849} 1850 1851.ui-icon-cloud-refresh { 1852background-position: -18px -134px; 1853} 1854 1855.ui-icon-cloud-setting { 1856background-position: -36px -134px; 1857} 1858 1859.ui-icon-cloud-share { 1860background-position: -54px -134px; 1861} 1862 1863.ui-icon-cloud-arrow-r { 1864background-position: -72px -134px; 1865} 1866 1867.ui-icon-cloud-delete { 1868background-position: -90px -134px; 1869} 1870 1871.ui-icon-cloud-rename{ 1872background-position: -108px -134px; 1873} 1874 1875.ui-icon-cloud-select{ 1876background-position: -125px -134px; 1877} 1878 1879.ui-icon-cloud-logout{ 1880background-position: -125px -134px; 1881} 1882 1883#content img{ 1884border:0px; 1885} 1886 1887#content .usbdisk { 1888background-position: 0 -55px; 1889} 1890 1891#content .sambapc{ 1892background-position: -40px -55px; 1893} 1894 1895#content .sambapcoff{ 1896background-position: -80px -55px; 1897} 1898 1899#content .prevpage { 1900background-position: -120px -55px; 1901} 1902 1903#content .folder { 1904background-position: -160px -55px; 1905} 1906 1907#content .folder.selectmode { 1908background-position: -160px -95px; 1909} 1910 1911#content .folder.selectmode { 1912background-position: -160px -95px; 1913} 1914 1915#content .folder .routerync { 1916background-position: 0 -280px; 1917position: relative; 1918left: 5px; 1919top: 3px; 1920} 1921 1922#content .fileDiv { 1923background-position: -200px -55px; 1924} 1925 1926#content .fileDiv.selectmode { 1927background-position: -200px -95px; 1928} 1929 1930#content .fileDiv.checked { 1931background-position: -200px -135px; 1932} 1933 1934#content .imgfileDiv { 1935background-position: -240px -55px; 1936} 1937 1938#content .imgfileDiv.selectmode { 1939background-position: -240px -95px; 1940} 1941 1942#content .imgfileDiv.checked { 1943background-position: -240px -135px; 1944} 1945 1946#content .videofileDiv { 1947background-position: -280px -55px; 1948} 1949 1950#content .videofileDiv.selectmode { 1951background-position: -280px -95px; 1952} 1953 1954#content .videofileDiv.checked { 1955background-position: -280px -135px; 1956} 1957 1958#content .audiofileDiv { 1959background-position: -320px -55px; 1960} 1961 1962#content .audiofileDiv.selectmode { 1963background-position: -320px -95px; 1964} 1965 1966#content .audiofileDiv.checked { 1967background-position: -320px -135px; 1968} 1969 1970#content .pptfileDiv { 1971background-position: -360px -55px; 1972} 1973 1974#content .pptfileDiv.selectmode { 1975background-position: -360px -95px; 1976} 1977 1978#content .pptfileDiv.checked { 1979background-position: -360px -135px; 1980} 1981 1982#content .docfileDiv { 1983background-position: -400px -55px; 1984} 1985 1986#content .docfileDiv.selectmode { 1987background-position: -400px -95px; 1988} 1989 1990#content .docfileDiv.checked { 1991background-position: -400px -135px; 1992} 1993 1994#content .xlsfileDiv { 1995background-position: -440px -55px; 1996} 1997 1998#content .xlsfileDiv.selectmode { 1999background-position: -440px -95px; 2000} 2001 2002#content .xlsfileDiv.checked { 2003background-position: -440px -135px; 2004} 2005 2006#content .pdffileDiv { 2007background-position: -480px -55px; 2008} 2009 2010#content .pdffileDiv.selectmode { 2011background-position: -480px -95px; 2012} 2013 2014#content .pdffileDiv.checked { 2015background-position: -480px -135px; 2016} 2017 2018li#list_item a{ 2019padding-left: 40px; 2020} 2021 2022li#list_item div#file_item{ 2023padding-left: 25px; 2024cursor:pointer; 2025} 2026 2027.ui-folder-icon{ 2028position:absolute; 2029top:10px; 2030} 2031 2032.ui-file-icon{ 2033position:absolute; 2034top:20px; 2035} 2036 2037div#select{ 2038width:130px; 2039top: 15px; 2040right: 10px; 2041} 2042 2043#table_login{ 2044width:100%; 2045} 2046 2047#share-content{ 2048color:#000; 2049background-color:#ccc; 2050} 2051 2052.setting-set h2{ 2053color:#000; 2054text-decoration: none; 2055} 2056 2057#btn-select{ 2058width: 60px; 2059height: 60px; 2060top:5px; 2061right:10px; 2062background-position: 0 -160px; 2063position:relative; 2064cursor:pointer; 2065} 2066#btn-select.click{ 2067background-position: -60px -160px; 2068} 2069 2070#btn-changeuser{ 2071width: 60px; 2072height: 60px; 2073top:5px; 2074right:10px; 2075background-position: 0 -220px; 2076position:relative; 2077cursor:pointer; 2078} 2079 2080/*-- Scroll Bar --------------------------------------*/ 2081::-webkit-scrollbar { 2082width: 10px; 2083height: 16px; 2084} 2085 2086::-webkit-scrollbar-button { 2087width: 0; 2088height: 0; 2089display: none; 2090} 2091 2092::-webkit-scrollbar-corner { 2093background-color: transparent; 2094} 2095 2096/* Track */ 2097::-webkit-scrollbar-track { 2098background-color: transparent; 2099} 2100 2101/* Handle */ 2102::-webkit-scrollbar-thumb { 2103background-color: rgba(129, 165, 194, 0.5); 2104-webkit-box-shadow: inset 1px 1px 0 rgba(255,255,255,0.10),inset 0 -1px 0 rgba(255,255,255,0.07) 2105} 2106::-webkit-scrollbar-thumb:window-inactive { 2107background: rgba(129, 165, 194, 0.4); 2108} 2109/*--------------------------------------*/ 2110 2111
