wp-includes/css/admin-bar.css

   1 #wpadminbar * {
   2         height: auto;
   3         width: auto;
   4         margin: 0;
   5         padding: 0;
   6         position: static;
   7         text-shadow: none;
   8         text-transform: none;
   9         letter-spacing: normal;
  10         font-size: 13px;
  11         font-weight: 400;
  12         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  13         line-height: 32px;
  14         -webkit-border-radius: 0;
  15         border-radius: 0;
  16         -webkit-box-sizing: content-box;
  17         -moz-box-sizing: content-box;
  18         box-sizing: content-box;
  19         -webkit-transition: none;
  20         transition: none;
  21         -webkit-font-smoothing: subpixel-antialiased; /* Prevent Safari from switching to standard antialiasing on hover */
  22         -moz-osx-font-smoothing: auto; /* Prevent Firefox from inheriting from themes that use other values */
  23 }
  24
  25 .rtl #wpadminbar * {
  26         font-family: Tahoma, sans-serif;
  27 }
  28
  29 html:lang(he-il) .rtl #wpadminbar *  {
  30         font-family: Arial, sans-serif;
  31 }
  32
  33 #wpadminbar .ab-empty-item {
  34         cursor: default;
  35 }
  36
  37 #wpadminbar .ab-empty-item,
  38 #wpadminbar a.ab-item,
  39 #wpadminbar > #wp-toolbar span.ab-label,
  40 #wpadminbar > #wp-toolbar span.noticon {
  41         color: #eee;
  42 }
  43
  44 #wpadminbar #wp-admin-bar-site-name a.ab-item,
  45 #wpadminbar #wp-admin-bar-my-sites a.ab-item {
  46         white-space: nowrap;
  47         overflow: hidden;
  48         text-overflow: ellipsis;
  49 }
  50
  51 #wpadminbar ul li:before,
  52 #wpadminbar ul li:after {
  53         content: normal;
  54 }
  55
  56 #wpadminbar a,
  57 #wpadminbar a:hover,
  58 #wpadminbar a img,
  59 #wpadminbar a img:hover {
  60         outline: none;
  61         border: none;
  62         text-decoration: none;
  63         background: none;
  64 }
  65
  66 #wpadminbar a:focus,
  67 #wpadminbar a:active,
  68 #wpadminbar input[type="text"],
  69 #wpadminbar input[type="password"],
  70 #wpadminbar input[type="number"],
  71 #wpadminbar input[type="search"],
  72 #wpadminbar input[type="email"],
  73 #wpadminbar input[type="url"],
  74 #wpadminbar select,
  75 #wpadminbar textarea,
  76 #wpadminbar div {
  77         -webkit-box-shadow: none;
  78         box-shadow: none;
  79         outline: none;
  80 }
  81
  82 #wpadminbar {
  83         direction: ltr;
  84         color: #ccc;
  85         font-size: 13px;
  86         font-weight: 400;
  87         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  88         line-height: 32px;
  89         height: 32px;
  90         position: fixed;
  91         top: 0;
  92         left: 0;
  93         width: 100%;
  94         min-width: 600px; /* match the min-width of the body in wp-admin.css */
  95         z-index: 99999;
  96         background: #23282d;
  97 }
  98
  99 #wpadminbar .ab-sub-wrapper,
 100 #wpadminbar ul,
 101 #wpadminbar ul li {
 102         background: none;
 103         clear: none;
 104         list-style: none;
 105         margin: 0;
 106         padding: 0;
 107         position: relative;
 108         text-indent: 0;
 109         z-index: 99999;
 110 }
 111
 112 #wpadminbar ul#wp-admin-bar-root-default>li {
 113         margin-right: 0;
 114 }
 115
 116 #wpadminbar .quicklinks ul {
 117         text-align: left;
 118 }
 119
 120 #wpadminbar li {
 121         float: left;
 122 }
 123
 124 #wpadminbar .ab-empty-item {
 125         outline: none;
 126 }
 127
 128 #wpadminbar .quicklinks .ab-top-secondary > li {
 129         float: right;
 130 }
 131
 132 #wpadminbar .quicklinks a,
 133 #wpadminbar .quicklinks .ab-empty-item,
 134 #wpadminbar .shortlink-input {
 135         height: 32px;
 136         display: block;
 137         padding: 0 10px;
 138         margin: 0;
 139 }
 140
 141 #wpadminbar .quicklinks > ul > li > a {
 142         padding: 0 8px 0 7px;
 143 }
 144
 145 #wpadminbar .menupop .ab-sub-wrapper,
 146 #wpadminbar .shortlink-input {
 147         margin: 0;
 148         padding: 0;
 149         -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
 150         box-shadow: 0 3px 5px rgba(0,0,0,0.2);
 151         background: #32373c;
 152         display: none;
 153         position: absolute;
 154         float: none;
 155 }
 156
 157 #wpadminbar.ie7 .menupop .ab-sub-wrapper,
 158 #wpadminbar.ie7 .shortlink-input {
 159         top: 32px;
 160         left: 0;
 161 }
 162
 163 #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
 164         min-width: 100%;
 165 }
 166
 167 #wpadminbar .ab-top-secondary .menupop .ab-sub-wrapper {
 168         right: 0;
 169         left: auto;
 170 }
 171
 172 #wpadminbar .ab-submenu {
 173         padding: 6px 0;
 174 }
 175
 176 #wpadminbar .selected .shortlink-input {
 177         display: block;
 178 }
 179
 180 #wpadminbar .quicklinks .menupop ul li {
 181         float: none;
 182 }
 183
 184 #wpadminbar .quicklinks .menupop ul li a strong {
 185         font-weight: 600;
 186 }
 187
 188 #wpadminbar .quicklinks .menupop ul li .ab-item,
 189 #wpadminbar .quicklinks .menupop ul li a strong,
 190 #wpadminbar .quicklinks .menupop.hover ul li .ab-item,
 191 #wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item,
 192 #wpadminbar .shortlink-input {
 193         line-height: 26px;
 194         height: 26px;
 195         white-space: nowrap;
 196         min-width: 140px;
 197 }
 198
 199 #wpadminbar .shortlink-input {
 200         width: 200px;
 201 }
 202
 203 #wpadminbar.nojs li:hover > .ab-sub-wrapper,
 204 #wpadminbar li.hover > .ab-sub-wrapper {
 205         display: block;
 206 }
 207
 208 #wpadminbar .menupop li:hover > .ab-sub-wrapper,
 209 #wpadminbar .menupop li.hover > .ab-sub-wrapper {
 210         margin-left: 100%;
 211         margin-top: -32px;
 212 }
 213
 214 #wpadminbar .ab-top-secondary .menupop li:hover > .ab-sub-wrapper,
 215 #wpadminbar .ab-top-secondary .menupop li.hover > .ab-sub-wrapper {
 216         margin-left: 0;
 217         left: inherit;
 218         right: 100%;
 219 }
 220
 221 #wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
 222 #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
 223 #wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
 224 #wpadminbar .ab-top-menu > li.hover > .ab-item {
 225         background: #32373c;
 226         color: #00b9eb;
 227 }
 228
 229 #wpadminbar:not(.mobile) > #wp-toolbar li:hover span.ab-label,
 230 #wpadminbar > #wp-toolbar li.hover span.ab-label,
 231 #wpadminbar:not(.mobile) > #wp-toolbar a:focus span.ab-label {
 232         color: #00b9eb;
 233 }
 234
 235 #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 236 #wpadminbar .ab-icon,
 237 #wpadminbar .ab-item:before {
 238         position: relative;
 239         float: left;
 240         font: normal 20px/1 dashicons;
 241         speak: none;
 242         padding: 4px 0;
 243         -webkit-font-smoothing: antialiased;
 244         -moz-osx-font-smoothing: grayscale;
 245         background-image: none !important;
 246         margin-right: 6px;
 247 }
 248
 249 #wpadminbar .ab-icon:before,
 250 #wpadminbar .ab-item:before,
 251 #wpadminbar #adminbarsearch:before {
 252         color: #a0a5aa;
 253         color: rgba(240,245,250,0.6);
 254 }
 255
 256 #wpadminbar .ab-icon:before,
 257 #wpadminbar .ab-item:before,
 258 #wpadminbar #adminbarsearch:before {
 259         position: relative;
 260         -webkit-transition: all .1s ease-in-out;
 261         transition: all .1s ease-in-out;
 262 }
 263
 264 #wpadminbar .ab-label {
 265         display: inline-block;
 266         height: 32px;
 267 }
 268
 269 #wpadminbar .ab-submenu .ab-item {
 270         color: #b4b9be;
 271         color: rgba(240,245,250,0.7);
 272 }
 273
 274 #wpadminbar .quicklinks .menupop ul li a,
 275 #wpadminbar .quicklinks .menupop ul li a strong,
 276 #wpadminbar .quicklinks .menupop.hover ul li a,
 277 #wpadminbar.nojs .quicklinks .menupop:hover ul li a {
 278         color: #b4b9be;
 279         color: rgba(240,245,250,0.7);
 280 }
 281
 282 #wpadminbar .quicklinks .menupop ul li a:hover,
 283 #wpadminbar .quicklinks .menupop ul li a:focus,
 284 #wpadminbar .quicklinks .menupop ul li a:hover strong,
 285 #wpadminbar .quicklinks .menupop ul li a:focus strong,
 286 #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a,
 287 #wpadminbar .quicklinks .menupop.hover ul li a:hover,
 288 #wpadminbar .quicklinks .menupop.hover ul li a:focus,
 289 #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:hover,
 290 #wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:focus,
 291 #wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
 292 #wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
 293 #wpadminbar li:hover .ab-icon:before,
 294 #wpadminbar li:hover .ab-item:before,
 295 #wpadminbar li a:focus .ab-icon:before,
 296 #wpadminbar li .ab-item:focus:before,
 297 #wpadminbar li .ab-item:focus .ab-icon:before,
 298 #wpadminbar li.hover .ab-icon:before,
 299 #wpadminbar li.hover .ab-item:before,
 300 #wpadminbar li:hover #adminbarsearch:before,
 301 #wpadminbar li #adminbarsearch.adminbar-focused:before {
 302         color: #00b9eb;
 303 }
 304
 305 #wpadminbar.mobile .quicklinks .ab-icon:before,
 306 #wpadminbar.mobile .quicklinks .ab-item:before {
 307         color: #b4b9be;
 308 }
 309
 310 #wpadminbar.mobile .quicklinks .hover .ab-icon:before,
 311 #wpadminbar.mobile .quicklinks .hover .ab-item:before {
 312         color: #00b9eb;
 313 }
 314
 315 #wpadminbar .menupop .menupop > .ab-item:before,
 316 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
 317         position: absolute;
 318         font: normal 17px/1 dashicons;
 319         speak: none;
 320         -webkit-font-smoothing: antialiased;
 321         -moz-osx-font-smoothing: grayscale;
 322 }
 323
 324 #wpadminbar .menupop .menupop > .ab-item {
 325         display: block;
 326         padding-right: 2em;
 327 }
 328
 329 #wpadminbar .menupop .menupop > .ab-item:before {
 330         top: 1px;
 331         right: 4px;
 332         content: "\f139";
 333         color: inherit;
 334 }
 335
 336 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item {
 337         padding-left: 2em;
 338         padding-right: 1em;
 339 }
 340
 341 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
 342         top: 1px;
 343         left: 6px;
 344         content: "\f141";
 345 }
 346
 347 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
 348         display: block;
 349         position: relative;
 350         right: auto;
 351         margin: 0;
 352         -webkit-box-shadow: none;
 353         box-shadow: none;
 354 }
 355
 356 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
 357 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
 358         background: #464b50;
 359 }
 360
 361 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li > a:hover,
 362 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus a {
 363         color: #00b9eb;
 364 }
 365
 366 #wpadminbar .quicklinks a span#ab-updates {
 367         background: #eee;
 368         color: #32373c;
 369         display: inline;
 370         padding: 2px 5px;
 371         font-size: 10px;
 372         font-weight: 600;
 373         -webkit-border-radius: 10px;
 374         border-radius: 10px;
 375 }
 376
 377 #wpadminbar .quicklinks a:hover span#ab-updates  {
 378         background: #fff;
 379         color: #000;
 380 }
 381
 382 #wpadminbar .ab-top-secondary {
 383         float: right;
 384 }
 385
 386 #wpadminbar ul li:last-child,
 387 #wpadminbar ul li:last-child .ab-item {
 388         -webkit-box-shadow: none;
 389         box-shadow: none;
 390 }
 391
 392 /**
 393  * My Account
 394  */
 395 #wp-admin-bar-my-account > ul {
 396         min-width: 198px;
 397 }
 398
 399 #wp-admin-bar-my-account > .ab-item:before {
 400         content: "\f110";
 401         top: 2px;
 402         float: right;
 403         margin-left: 6px;
 404         margin-right: 0;
 405 }
 406
 407 #wp-admin-bar-my-account.with-avatar > .ab-item:before {
 408         display: none;
 409         content: none;
 410 }
 411
 412 #wp-admin-bar-my-account.with-avatar > ul {
 413         min-width: 270px;
 414 }
 415
 416 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar .ab-item {
 417         white-space: nowrap;
 418 }
 419
 420 #wpadminbar #wp-admin-bar-user-actions > li {
 421         margin-left: 16px;
 422         margin-right: 16px;
 423 }
 424
 425 #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
 426         padding: 6px 0 12px;
 427 }
 428
 429 #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
 430         margin-left: 88px;
 431 }
 432
 433 #wpadminbar #wp-admin-bar-user-info {
 434         margin-top: 6px;
 435         margin-bottom: 15px;
 436         height: auto;
 437         background: none;
 438 }
 439
 440 #wp-admin-bar-user-info .avatar {
 441         position: absolute;
 442         left: -72px;
 443         top: 4px;
 444         width: 64px;
 445         height: 64px;
 446 }
 447
 448 #wpadminbar #wp-admin-bar-user-info a {
 449         background: none;
 450         height: auto;
 451 }
 452
 453 #wpadminbar #wp-admin-bar-user-info span {
 454         background: none;
 455         padding: 0;
 456         height: 18px;
 457 }
 458
 459 #wpadminbar #wp-admin-bar-user-info .display-name,
 460 #wpadminbar #wp-admin-bar-user-info .username {
 461         display: block;
 462 }
 463
 464 #wpadminbar #wp-admin-bar-user-info .username {
 465         color: #a0a5aa;
 466         font-size: 11px;
 467 }
 468
 469 #wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
 470 #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
 471         width: auto;
 472         height: 16px;
 473         padding: 0;
 474         border: 1px solid #82878c;
 475         background: #eee;
 476         line-height: 24px;
 477         vertical-align: middle;
 478         margin: -4px 0 0 6px;
 479         float: none;
 480         display: inline;
 481 }
 482
 483 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
 484 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar > a img {
 485         width: auto;
 486 }
 487
 488 /**
 489  * WP Logo
 490  */
 491 #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 492         width: 15px;
 493         height: 20px;
 494         margin-right: 0;
 495         padding: 6px 0 5px;
 496 }
 497
 498 #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 499         padding: 0 7px;
 500 }
 501
 502 #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
 503         content: "\f120";
 504         top: 2px;
 505 }
 506
 507 /*
 508  * My Sites & Site Title
 509  */
 510 #wpadminbar .quicklinks li .blavatar {
 511         float: left;
 512         font: normal 16px/1 dashicons !important;
 513         speak: none;
 514         -webkit-font-smoothing: antialiased;
 515         -moz-osx-font-smoothing: grayscale;
 516         color: #eee;
 517 }
 518
 519 #wpadminbar .quicklinks li a:hover .blavatar,
 520 #wpadminbar .quicklinks li a:focus .blavatar,
 521 #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar {
 522         color: #00b9eb;
 523 }
 524
 525 #wpadminbar .quicklinks li .blavatar:before {
 526         content: "\f120";
 527         height: 16px;
 528         width: 16px;
 529         display: inline-block;
 530         margin: 6px 8px 0 -2px;
 531 }
 532
 533 #wpadminbar #wp-admin-bar-appearance {
 534         margin-top: -12px;
 535 }
 536
 537 #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
 538 #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 539         content: "\f541";
 540         top: 2px;
 541 }
 542
 543 #wpadminbar #wp-admin-bar-customize > .ab-item:before {
 544         content: "\f540";
 545         top: 2px;
 546 }
 547
 548
 549 #wpadminbar #wp-admin-bar-edit > .ab-item:before {
 550         content: "\f464";
 551         top: 2px;
 552 }
 553
 554 #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 555         content: "\f226";
 556 }
 557
 558 .wp-admin #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 559         content: "\f102";
 560 }
 561
 562
 563
 564 /**
 565  * Comments
 566  */
 567 #wpadminbar #wp-admin-bar-comments .ab-icon {
 568         margin-right: 6px;
 569 }
 570
 571 #wpadminbar #wp-admin-bar-comments .ab-icon:before {
 572         content: "\f101";
 573         top: 3px;
 574 }
 575
 576 #wpadminbar #wp-admin-bar-comments .count-0 {
 577         opacity: .5;
 578 }
 579
 580 /**
 581  * New Content
 582  */
 583 #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
 584         content: "\f132";
 585         top: 4px;
 586 }
 587
 588 /**
 589  * Updates
 590  */
 591 #wpadminbar #wp-admin-bar-updates .ab-icon:before {
 592         content: "\f463";
 593         top: 2px;
 594 }
 595
 596 /**
 597  * Search
 598  */
 599 #wpadminbar.ie8 #wp-admin-bar-search {
 600         display: block;
 601         min-width: 32px;
 602 }
 603 #wpadminbar #wp-admin-bar-search .ab-item {
 604         padding: 0;
 605         background: transparent;
 606 }
 607
 608 #wpadminbar #adminbarsearch {
 609         position: relative;
 610         height: 32px;
 611         padding: 0 2px;
 612         z-index: 1;
 613 }
 614
 615 #wpadminbar #adminbarsearch:before {
 616         position: absolute;
 617         top: 6px;
 618         left: 5px;
 619         z-index: 20;
 620         font: normal 20px/1 dashicons !important;
 621         content: "\f179";
 622         speak: none;
 623         -webkit-font-smoothing: antialiased;
 624         -moz-osx-font-smoothing: grayscale;
 625 }
 626
 627 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 628         position: relative;
 629         z-index: 30;
 630         font-size: 13px;
 631         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 632         line-height: 24px;
 633         height: 24px;
 634         width: 24px;
 635         max-width: none;
 636         padding: 0 3px 0 24px;
 637         margin: 0;
 638         color: #ccc;
 639         background-color: rgba( 255, 255, 255, 0 );
 640         border: none;
 641         outline: none;
 642         cursor: pointer;
 643         -webkit-box-shadow: none;
 644         box-shadow: none;
 645         -webkit-box-sizing: border-box;
 646         -moz-box-sizing: border-box;
 647         box-sizing: border-box;
 648         -webkit-transition-duration: 400ms;
 649         transition-duration: 400ms;
 650         -webkit-transition-property: width, background;
 651         transition-property: width, background;
 652         -webkit-transition-timing-function: ease;
 653         transition-timing-function: ease;
 654 }
 655
 656 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 657         z-index: 10;
 658         color: #000;
 659         width: 200px;
 660         background-color: rgba( 255, 255, 255, 0.9 );
 661         cursor: text;
 662         border: 0;
 663 }
 664
 665 #wpadminbar.ie7 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 666         margin-top: 3px;
 667         width: 120px;
 668 }
 669
 670 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 671         /* IE8 z-index bug with transparent / empty elements - fill in with an encoded transparent GIF */
 672         background: transparent 0 0 repeat scroll url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBR‌AA7");
 673 }
 674
 675 /* IE8 doesn't redraw the pseudo elements unless you make a change to the content */
 676 #wpadminbar.ie8 #adminbarsearch.adminbar-focused:before {
 677         content: "\f179 "; /* extra space */
 678 }
 679
 680 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 681         background: #fff;
 682         z-index: -1;
 683 }
 684
 685 #wpadminbar #adminbarsearch .adminbar-button {
 686         display: none;
 687 }
 688
 689 /**
 690  * Customize support classes
 691  */
 692 .no-customize-support .hide-if-no-customize,
 693 .customize-support .hide-if-customize,
 694 .no-customize-support #wpadminbar .hide-if-no-customize,
 695 .no-customize-support.wp-core-ui .hide-if-no-customize,
 696 .no-customize-support .wp-core-ui .hide-if-no-customize,
 697 .customize-support #wpadminbar .hide-if-customize,
 698 .customize-support.wp-core-ui .hide-if-customize,
 699 .customize-support .wp-core-ui .hide-if-customize {
 700         display: none;
 701 }
 702
 703 /* Skip link */
 704 #wpadminbar .screen-reader-text,
 705 #wpadminbar .screen-reader-text span {
 706         position: absolute;
 707         left: -1000em;
 708         top: -1000em;
 709         height: 1px;
 710         width: 1px;
 711         overflow: hidden;
 712 }
 713
 714 #wpadminbar .screen-reader-shortcut {
 715         position: absolute;
 716         top: -1000em;
 717 }
 718
 719 #wpadminbar .screen-reader-shortcut:focus {
 720         left: 6px;
 721         top: 7px;
 722         height: auto;
 723         width: auto;
 724         display: block;
 725         font-size: 14px;
 726         font-weight: 600;
 727         padding: 15px 23px 14px;
 728         background: #f1f1f1;
 729         color: #0073aa;
 730         z-index: 100000;
 731         line-height: normal;
 732         text-decoration: none;
 733         -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 734         box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 735 }
 736
 737 /**
 738  * IE 6-targeted rules
 739  */
 740 * html #wpadminbar {
 741         overflow: hidden;
 742         position: absolute;
 743 }
 744
 745 * html #wpadminbar .quicklinks ul li a {
 746         float: left;
 747 }
 748
 749 * html #wpadminbar .menupop a span {
 750         background-image: none;
 751 }
 752
 753 /* No @font-face support */
 754 .no-font-face #wpadminbar ul.ab-top-menu > li > a.ab-item {
 755         display: block;
 756         width: 45px;
 757         text-align: center;
 758         overflow: hidden;
 759         margin: 0 3px;
 760 }
 761
 762 .no-font-face #wpadminbar #wp-admin-bar-my-sites > .ab-item,
 763 .no-font-face #wpadminbar #wp-admin-bar-site-name > .ab-item,
 764 .no-font-face #wpadminbar #wp-admin-bar-edit > .ab-item {
 765         text-indent: 0;
 766 }
 767
 768 .no-font-face #wpadminbar .ab-icon,
 769 .no-font-face #wpadminbar .ab-icon:before,
 770 .no-font-face #wpadminbar a.ab-item:before,
 771 .no-font-face #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 772         display: none !important;
 773 }
 774
 775 .no-font-face #wpadminbar ul.ab-top-menu > li > a > span.ab-label {
 776         display: inline;
 777 }
 778
 779 .no-font-face #wpadminbar #wp-admin-bar-menu-toggle span.ab-icon {
 780         display: inline !important;
 781 }
 782
 783 .no-font-face #wpadminbar #wp-admin-bar-menu-toggle span.ab-icon:before {
 784         content: "Menu";
 785         font: 14px/45px sans-serif !important;
 786         display: inline-block !important;
 787         color: #fff;
 788 }
 789
 790 .no-font-face #wpadminbar #wp-admin-bar-site-name a.ab-item {
 791         color: #fff;
 792 }
 793 /* End no @font-face */
 794
 795 @media screen and ( max-width: 782px ) {
 796         /* Toolbar Touchification*/
 797         html #wpadminbar {
 798                 height: 46px;
 799                 min-width: 300px;
 800
 801         /*      These rules break dropdown tappability on Chrome/Android.
 802                 -webkit-transform: translate3d(0, 0, 0);
 803                 -webkit-backface-visibility: hidden;
 804                 -webkit-transition: 0;
 805                 transform: translate3d(0, 0, 0);
 806                 backface-visibility: hidden;
 807                 transition: 0;
 808         */
 809         }
 810
 811         #wpadminbar * {
 812                 font-size: 14px;
 813                 font-weight: 400;
 814                 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 815                 line-height: 32px;
 816         }
 817
 818         #wpadminbar .quicklinks > ul > li > a,
 819         #wpadminbar .quicklinks .ab-empty-item {
 820                 padding: 0;
 821                 height: 46px;
 822                 line-height: 46px;
 823                 width: auto;
 824         }
 825
 826         #wpadminbar .ab-icon {
 827                 font: 40px/1 dashicons !important;
 828                 margin: 0;
 829                 padding: 0;
 830                 width: 52px;
 831                 height: 46px;
 832                 text-align: center;
 833         }
 834
 835         #wpadminbar .ab-icon:before {
 836                 text-align: center;
 837         }
 838
 839         #wpadminbar .ab-submenu {
 840                 padding: 0;
 841         }
 842
 843         #wpadminbar #wp-admin-bar-site-name a.ab-item,
 844         #wpadminbar #wp-admin-bar-my-sites a.ab-item,
 845         #wpadminbar #wp-admin-bar-my-account a.ab-item {
 846                 text-overflow: clip;
 847         }
 848
 849         #wpadminbar .ab-label {
 850                 display: none;
 851         }
 852
 853         #wpadminbar .menupop li:hover > .ab-sub-wrapper,
 854         #wpadminbar .menupop li.hover > .ab-sub-wrapper {
 855                 margin-top: -46px;
 856         }
 857
 858         #wpadminbar .ab-top-menu .menupop .ab-sub-wrapper .menupop > .ab-item {
 859                 padding-right: 30px;
 860         }
 861
 862         #wpadminbar .menupop .menupop > .ab-item:before {
 863                 top: 10px;
 864                 right: 6px;
 865         }
 866
 867         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper .ab-item {
 868                 font-size: 16px;
 869                 padding: 8px 16px;
 870         }
 871
 872         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper a:empty {
 873                 display: none;
 874         }
 875
 876         /* WP logo */
 877         #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 878                 padding: 0;
 879         }
 880
 881         #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 882                 padding: 0;
 883                 width: 52px;
 884                 height: 46px;
 885                 text-align: center;
 886                 vertical-align: top;
 887         }
 888
 889         #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
 890                 font: 28px/1 dashicons !important;
 891                 top: -3px;
 892         }
 893
 894         #wpadminbar .ab-icon,
 895         #wpadminbar .ab-item:before {
 896                 padding: 0;
 897         }
 898
 899         /* My Sites and "Site Title" menu */
 900         #wpadminbar #wp-admin-bar-my-sites > .ab-item,
 901         #wpadminbar #wp-admin-bar-site-name > .ab-item,
 902         #wpadminbar #wp-admin-bar-customize > .ab-item,
 903         #wpadminbar #wp-admin-bar-edit > .ab-item,
 904         #wpadminbar #wp-admin-bar-my-account > .ab-item {
 905                 text-indent: 100%;
 906                 white-space: nowrap;
 907                 overflow: hidden;
 908                 width: 52px;
 909                 padding: 0;
 910                 color: #a0a5aa; /* @todo not needed? this text is hidden */
 911                 position: relative;
 912         }
 913
 914         #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 915         #wpadminbar .ab-icon,
 916         #wpadminbar .ab-item:before {
 917                 padding: 0;
 918                 margin-right: 0;
 919         }
 920
 921         #wpadminbar #wp-admin-bar-edit > .ab-item:before,
 922         #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
 923         #wpadminbar #wp-admin-bar-site-name > .ab-item:before,
 924         #wpadminbar #wp-admin-bar-customize > .ab-item:before,
 925         #wpadminbar #wp-admin-bar-my-account > .ab-item:before {
 926                 display: block;
 927                 text-indent: 0;
 928                 font: normal 32px/1 dashicons;
 929                 speak: none;
 930                 top: 7px;
 931                 width: 52px;
 932                 text-align: center;
 933                 -webkit-font-smoothing: antialiased;
 934                 -moz-osx-font-smoothing: grayscale;
 935         }
 936
 937         #wpadminbar #wp-admin-bar-appearance {
 938                 margin-top: 0;
 939         }
 940
 941         #wpadminbar .quicklinks li .blavatar:before {
 942                 display: none;
 943         }
 944
 945         /* Search */
 946         #wpadminbar #wp-admin-bar-search {
 947                 display: none;
 948         }
 949
 950         /* New Content */
 951         #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
 952                 top: 0;
 953                 line-height: 53px;
 954                 height: 46px !important;
 955                 text-align: center;
 956                 width: 52px;
 957                 display: block;
 958         }
 959
 960         /* Updates */
 961         #wpadminbar #wp-admin-bar-updates {
 962                 text-align: center;
 963         }
 964
 965         #wpadminbar #wp-admin-bar-updates .ab-icon:before {
 966                 top: 3px;
 967         }
 968
 969         /* Comments */
 970         #wpadminbar #wp-admin-bar-comments .ab-icon {
 971                 margin: 0;
 972         }
 973
 974         #wpadminbar #wp-admin-bar-comments .ab-icon:before {
 975                 display: block;
 976                 font-size: 34px;
 977                 height: 46px;
 978                 line-height: 47px;
 979                 top: 0;
 980         }
 981
 982         /* My Account */
 983         #wpadminbar #wp-admin-bar-my-account > a {
 984                 position: relative;
 985                 white-space: nowrap;
 986                 text-indent: 150%; /* More than 100% indention is needed since this element has padding */
 987                 width: 28px;
 988                 padding: 0 10px;
 989                 overflow: hidden; /* Prevent link text from forcing horizontal scrolling on mobile */
 990         }
 991
 992         #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
 993                 position: absolute;
 994                 top: 13px;
 995                 right: 10px;
 996                 width: 26px;
 997                 height: 26px;
 998         }
 999
1000         #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
1001                 padding: 0;
1002         }
1003
1004         #wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
1005                 display: none;
1006         }
1007
1008         #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
1009                 margin: 0;
1010         }
1011
1012         #wpadminbar #wp-admin-bar-user-info .display-name {
1013                 height: auto;
1014                 font-size: 16px;
1015                 line-height: 24px;
1016                 color: #eee;
1017         }
1018
1019         #wpadminbar #wp-admin-bar-user-info a {
1020                 padding-top: 4px;
1021         }
1022
1023         #wpadminbar #wp-admin-bar-user-info .username {
1024                 line-height: 0.8 !important;
1025                 margin-bottom: -2px;
1026         }
1027
1028         /* Show only default top level items */
1029         #wp-toolbar > ul > li {
1030                 display: none;
1031         }
1032
1033         #wpadminbar li#wp-admin-bar-menu-toggle,
1034         #wpadminbar li#wp-admin-bar-wp-logo,
1035         #wpadminbar li#wp-admin-bar-my-sites,
1036         #wpadminbar li#wp-admin-bar-updates,
1037         #wpadminbar li#wp-admin-bar-site-name,
1038         #wpadminbar li#wp-admin-bar-customize,
1039         #wpadminbar li#wp-admin-bar-new-content,
1040         #wpadminbar li#wp-admin-bar-edit,
1041         #wpadminbar li#wp-admin-bar-comments,
1042         #wpadminbar li#wp-admin-bar-my-account {
1043                 display: block;
1044         }
1045
1046         /* Allow dropdown list items to appear normally */
1047         #wpadminbar li:hover ul li,
1048         #wpadminbar li.hover ul li,
1049         #wpadminbar li:hover ul li:hover ul li {
1050                 display: list-item;
1051         }
1052
1053         /* Override default min-width so dropdown lists aren't stretched
1054                 to 100% viewport width at responsive sizes. */
1055         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1056                 min-width: -webkit-fit-content;
1057                 min-width: -moz-fit-content;
1058                 min-width: fit-content;
1059         }
1060
1061         #wpadminbar ul#wp-admin-bar-root-default > li {
1062                 margin-right: 0;
1063         }
1064
1065         /* Experimental fix for touch toolbar dropdown positioning */
1066         #wpadminbar .ab-top-menu,
1067         #wpadminbar .ab-top-secondary,
1068         #wpadminbar #wp-admin-bar-wp-logo,
1069         #wpadminbar #wp-admin-bar-my-sites,
1070         #wpadminbar #wp-admin-bar-site-name,
1071         #wpadminbar #wp-admin-bar-updates,
1072         #wpadminbar #wp-admin-bar-comments,
1073         #wpadminbar #wp-admin-bar-new-content,
1074         #wpadminbar #wp-admin-bar-edit,
1075         #wpadminbar #wp-admin-bar-my-account {
1076                 position: static;
1077         }
1078
1079         #wpadminbar #wp-admin-bar-my-account {
1080                 float: right;
1081         }
1082
1083         .network-admin #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
1084                 margin-right: 0;
1085         }
1086
1087         /* Realign arrows on taller responsive submenus */
1088
1089         #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
1090                 top: 10px;
1091                 left: 0;
1092         }
1093 }
1094
1095 /* Smartphone */
1096 @media screen and (max-width: 600px) {
1097         #wpadminbar {
1098                 position: absolute;
1099         }
1100
1101         #wp-responsive-overlay {
1102                 position: fixed;
1103                 top: 0;
1104                 left: 0;
1105                 width: 100%;
1106                 height: 100%;
1107                 z-index: 400;
1108         }
1109
1110         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1111                 width: 100%;
1112                 left: 0;
1113         }
1114
1115         #wpadminbar .menupop .menupop > .ab-item:before {
1116                 display: none;
1117         }
1118
1119         #wpadminbar #wp-admin-bar-wp-logo.menupop .ab-sub-wrapper {
1120                 margin-left: 0;
1121         }
1122
1123         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
1124                 margin: 0;
1125                 width: 100%;
1126                 top: auto;
1127                 left: auto;
1128                 position: relative;
1129         }
1130
1131         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper .ab-item {
1132                 font-size: 16px;
1133                 padding: 6px 15px 19px 30px;
1134         }
1135
1136         #wpadminbar li:hover ul li ul li {
1137                 display: list-item;
1138         }
1139
1140         #wpadminbar li#wp-admin-bar-wp-logo,
1141         #wpadminbar li#wp-admin-bar-updates {
1142                 display: none;
1143         }
1144
1145         /* Make submenus full-width at this size */
1146
1147         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
1148                 position: static;
1149                 -webkit-box-shadow: none;
1150                 box-shadow: none;
1151         }
1152 }
1153
1154 /* Very narrow screens */
1155 @media screen and (max-width: 400px) {
1156         #wpadminbar li#wp-admin-bar-comments {
1157                 display: none;
1158         }
1159 }