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.hover .ab-icon:before,
 298 #wpadminbar li.hover .ab-item:before,
 299 #wpadminbar li:hover #adminbarsearch:before,
 300 #wpadminbar li #adminbarsearch.adminbar-focused:before {
 301         color: #00b9eb;
 302 }
 303
 304 #wpadminbar.mobile .quicklinks .ab-icon:before,
 305 #wpadminbar.mobile .quicklinks .ab-item:before {
 306         color: #b4b9be;
 307 }
 308
 309 #wpadminbar.mobile .quicklinks .hover .ab-icon:before,
 310 #wpadminbar.mobile .quicklinks .hover .ab-item:before {
 311         color: #00b9eb;
 312 }
 313
 314 #wpadminbar .menupop .menupop > .ab-item:before,
 315 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
 316         position: absolute;
 317         font: normal 17px/1 dashicons;
 318         speak: none;
 319         -webkit-font-smoothing: antialiased;
 320         -moz-osx-font-smoothing: grayscale;
 321 }
 322
 323 #wpadminbar .menupop .menupop > .ab-item {
 324         display: block;
 325         padding-right: 2em;
 326 }
 327
 328 #wpadminbar .menupop .menupop > .ab-item:before {
 329         top: 1px;
 330         right: 4px;
 331         content: "\f139";
 332         color: inherit;
 333 }
 334
 335 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item {
 336         padding-left: 2em;
 337         padding-right: 1em;
 338 }
 339
 340 #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
 341         top: 1px;
 342         left: 6px;
 343         content: "\f141";
 344 }
 345
 346 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary {
 347         display: block;
 348         position: relative;
 349         right: auto;
 350         margin: 0;
 351         -webkit-box-shadow: none;
 352         box-shadow: none;
 353 }
 354
 355 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
 356 #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
 357         background: #464b50;
 358 }
 359
 360 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li > a:hover,
 361 #wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus a {
 362         color: #00b9eb;
 363 }
 364
 365 #wpadminbar .quicklinks a span#ab-updates {
 366         background: #eee;
 367         color: #32373c;
 368         display: inline;
 369         padding: 2px 5px;
 370         font-size: 10px;
 371         font-weight: 600;
 372         -webkit-border-radius: 10px;
 373         border-radius: 10px;
 374 }
 375
 376 #wpadminbar .quicklinks a:hover span#ab-updates  {
 377         background: #fff;
 378         color: #000;
 379 }
 380
 381 #wpadminbar .ab-top-secondary {
 382         float: right;
 383 }
 384
 385 #wpadminbar ul li:last-child,
 386 #wpadminbar ul li:last-child .ab-item {
 387         -webkit-box-shadow: none;
 388         box-shadow: none;
 389 }
 390
 391 /**
 392  * My Account
 393  */
 394 #wp-admin-bar-my-account > ul {
 395         min-width: 198px;
 396 }
 397
 398 #wp-admin-bar-my-account > .ab-item:before {
 399         content: "\f110";
 400         top: 2px;
 401         float: right;
 402         margin-left: 6px;
 403         margin-right: 0;
 404 }
 405
 406 #wp-admin-bar-my-account.with-avatar > .ab-item:before {
 407         display: none;
 408         content: none;
 409 }
 410
 411 #wp-admin-bar-my-account.with-avatar > ul {
 412         min-width: 270px;
 413 }
 414
 415 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar .ab-item {
 416         white-space: nowrap;
 417 }
 418
 419 #wpadminbar #wp-admin-bar-user-actions > li {
 420         margin-left: 16px;
 421         margin-right: 16px;
 422 }
 423
 424 #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
 425         padding: 6px 0 12px;
 426 }
 427
 428 #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
 429         margin-left: 88px;
 430 }
 431
 432 #wpadminbar #wp-admin-bar-user-info {
 433         margin-top: 6px;
 434         margin-bottom: 15px;
 435         height: auto;
 436         background: none;
 437 }
 438
 439 #wp-admin-bar-user-info .avatar {
 440         position: absolute;
 441         left: -72px;
 442         top: 4px;
 443         width: 64px;
 444         height: 64px;
 445 }
 446
 447 #wpadminbar #wp-admin-bar-user-info a {
 448         background: none;
 449         height: auto;
 450 }
 451
 452 #wpadminbar #wp-admin-bar-user-info span {
 453         background: none;
 454         padding: 0;
 455         height: 18px;
 456 }
 457
 458 #wpadminbar #wp-admin-bar-user-info .display-name,
 459 #wpadminbar #wp-admin-bar-user-info .username {
 460         display: block;
 461 }
 462
 463 #wpadminbar #wp-admin-bar-user-info .username {
 464         color: #a0a5aa;
 465         font-size: 11px;
 466 }
 467
 468 #wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
 469 #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
 470         width: auto;
 471         height: 16px;
 472         padding: 0;
 473         border: 1px solid #82878c;
 474         background: #eee;
 475         line-height: 24px;
 476         vertical-align: middle;
 477         margin: -4px 0 0 6px;
 478         float: none;
 479         display: inline;
 480 }
 481
 482 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
 483 #wpadminbar.ie8 #wp-admin-bar-my-account.with-avatar > a img {
 484         width: auto;
 485 }
 486
 487 /**
 488  * WP Logo
 489  */
 490 #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 491         width: 15px;
 492         height: 20px;
 493         margin-right: 0;
 494         padding: 6px 0 5px;
 495 }
 496
 497 #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 498         padding: 0 7px;
 499 }
 500
 501 #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
 502         content: "\f120";
 503         top: 2px;
 504 }
 505
 506 /*
 507  * My Sites & Site Title
 508  */
 509 #wpadminbar .quicklinks li .blavatar {
 510         float: left;
 511         font: normal 16px/1 dashicons !important;
 512         speak: none;
 513         -webkit-font-smoothing: antialiased;
 514         -moz-osx-font-smoothing: grayscale;
 515         color: #eee;
 516 }
 517
 518 #wpadminbar .quicklinks li a:hover .blavatar,
 519 #wpadminbar .quicklinks li a:focus .blavatar,
 520 #wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar {
 521         color: #00b9eb;
 522 }
 523
 524 #wpadminbar .quicklinks li .blavatar:before {
 525         content: "\f120";
 526         height: 16px;
 527         width: 16px;
 528         display: inline-block;
 529         margin: 6px 8px 0 -2px;
 530 }
 531
 532 #wpadminbar #wp-admin-bar-appearance {
 533         margin-top: -12px;
 534 }
 535
 536 #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
 537 #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 538         content: "\f541";
 539         top: 2px;
 540 }
 541
 542 #wpadminbar #wp-admin-bar-customize > .ab-item:before {
 543         content: "\f540";
 544         top: 2px;
 545 }
 546
 547
 548 #wpadminbar #wp-admin-bar-edit > .ab-item:before {
 549         content: "\f464";
 550         top: 2px;
 551 }
 552
 553 #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 554         content: "\f226";
 555 }
 556
 557 .wp-admin #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
 558         content: "\f102";
 559 }
 560
 561
 562
 563 /**
 564  * Comments
 565  */
 566 #wpadminbar #wp-admin-bar-comments .ab-icon {
 567         margin-right: 6px;
 568 }
 569
 570 #wpadminbar #wp-admin-bar-comments .ab-icon:before {
 571         content: "\f101";
 572         top: 3px;
 573 }
 574
 575 #wpadminbar #wp-admin-bar-comments .count-0 {
 576         opacity: .5;
 577 }
 578
 579 /**
 580  * New Content
 581  */
 582 #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
 583         content: "\f132";
 584         top: 4px;
 585 }
 586
 587 /**
 588  * Updates
 589  */
 590 #wpadminbar #wp-admin-bar-updates .ab-icon:before {
 591         content: "\f463";
 592         top: 2px;
 593 }
 594
 595 /**
 596  * Search
 597  */
 598 #wpadminbar.ie8 #wp-admin-bar-search {
 599         display: block;
 600         min-width: 32px;
 601 }
 602 #wpadminbar #wp-admin-bar-search .ab-item {
 603         padding: 0;
 604         background: transparent;
 605 }
 606
 607 #wpadminbar #adminbarsearch {
 608         position: relative;
 609         height: 32px;
 610         padding: 0 2px;
 611         z-index: 1;
 612 }
 613
 614 #wpadminbar #adminbarsearch:before {
 615         position: absolute;
 616         top: 6px;
 617         left: 5px;
 618         z-index: 20;
 619         font: normal 20px/1 dashicons !important;
 620         content: "\f179";
 621         speak: none;
 622         -webkit-font-smoothing: antialiased;
 623         -moz-osx-font-smoothing: grayscale;
 624 }
 625
 626 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 627         position: relative;
 628         z-index: 30;
 629         font-size: 13px;
 630         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 631         line-height: 24px;
 632         height: 24px;
 633         width: 24px;
 634         max-width: none;
 635         padding: 0 3px 0 24px;
 636         margin: 0;
 637         color: #ccc;
 638         background-color: rgba( 255, 255, 255, 0 );
 639         border: none;
 640         outline: none;
 641         cursor: pointer;
 642         -webkit-box-shadow: none;
 643         box-shadow: none;
 644         -webkit-box-sizing: border-box;
 645         -moz-box-sizing: border-box;
 646         box-sizing: border-box;
 647         -webkit-transition-duration: 400ms;
 648         transition-duration: 400ms;
 649         -webkit-transition-property: width, background;
 650         transition-property: width, background;
 651         -webkit-transition-timing-function: ease;
 652         transition-timing-function: ease;
 653 }
 654
 655 #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 656         z-index: 10;
 657         color: #000;
 658         width: 200px;
 659         background-color: rgba( 255, 255, 255, 0.9 );
 660         cursor: text;
 661         border: 0;
 662 }
 663
 664 #wpadminbar.ie7 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 665         margin-top: 3px;
 666         width: 120px;
 667 }
 668
 669 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
 670         /* IE8 z-index bug with transparent / empty elements - fill in with an encoded transparent GIF */
 671         background: transparent 0 0 repeat scroll url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBR‌AA7");
 672 }
 673
 674 /* IE8 doesn't redraw the pseudo elements unless you make a change to the content */
 675 #wpadminbar.ie8 #adminbarsearch.adminbar-focused:before {
 676         content: "\f179 "; /* extra space */
 677 }
 678
 679 #wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 680         background: #fff;
 681         z-index: -1;
 682 }
 683
 684 #wpadminbar #adminbarsearch .adminbar-button {
 685         display: none;
 686 }
 687
 688 /**
 689  * Customize support classes
 690  */
 691 .no-customize-support .hide-if-no-customize,
 692 .customize-support .hide-if-customize,
 693 .no-customize-support #wpadminbar .hide-if-no-customize,
 694 .no-customize-support.wp-core-ui .hide-if-no-customize,
 695 .no-customize-support .wp-core-ui .hide-if-no-customize,
 696 .customize-support #wpadminbar .hide-if-customize,
 697 .customize-support.wp-core-ui .hide-if-customize,
 698 .customize-support .wp-core-ui .hide-if-customize {
 699         display: none;
 700 }
 701
 702 /* Skip link */
 703 #wpadminbar .screen-reader-text,
 704 #wpadminbar .screen-reader-text span {
 705         position: absolute;
 706         left: -1000em;
 707         top: -1000em;
 708         height: 1px;
 709         width: 1px;
 710         overflow: hidden;
 711 }
 712
 713 #wpadminbar .screen-reader-shortcut {
 714         position: absolute;
 715         top: -1000em;
 716 }
 717
 718 #wpadminbar .screen-reader-shortcut:focus {
 719         left: 6px;
 720         top: 7px;
 721         height: auto;
 722         width: auto;
 723         display: block;
 724         font-size: 14px;
 725         font-weight: 600;
 726         padding: 15px 23px 14px;
 727         background: #f1f1f1;
 728         color: #0073aa;
 729         z-index: 100000;
 730         line-height: normal;
 731         text-decoration: none;
 732         -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 733         box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 734 }
 735
 736 /**
 737  * IE 6-targeted rules
 738  */
 739 * html #wpadminbar {
 740         overflow: hidden;
 741         position: absolute;
 742 }
 743
 744 * html #wpadminbar .quicklinks ul li a {
 745         float: left;
 746 }
 747
 748 * html #wpadminbar .menupop a span {
 749         background-image: none;
 750 }
 751
 752 /* No @font-face support */
 753 .no-font-face #wpadminbar ul.ab-top-menu > li > a.ab-item {
 754         display: block;
 755         width: 45px;
 756         text-align: center;
 757         overflow: hidden;
 758         margin: 0 3px;
 759 }
 760
 761 .no-font-face #wpadminbar #wp-admin-bar-my-sites > .ab-item,
 762 .no-font-face #wpadminbar #wp-admin-bar-site-name > .ab-item,
 763 .no-font-face #wpadminbar #wp-admin-bar-edit > .ab-item {
 764         text-indent: 0;
 765 }
 766
 767 .no-font-face #wpadminbar .ab-icon,
 768 .no-font-face #wpadminbar .ab-icon:before,
 769 .no-font-face #wpadminbar a.ab-item:before,
 770 .no-font-face #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 771         display: none !important;
 772 }
 773
 774 .no-font-face #wpadminbar ul.ab-top-menu > li > a > span.ab-label {
 775         display: inline;
 776 }
 777
 778 .no-font-face #wpadminbar #wp-admin-bar-menu-toggle span.ab-icon {
 779         display: inline !important;
 780 }
 781
 782 .no-font-face #wpadminbar #wp-admin-bar-menu-toggle span.ab-icon:before {
 783         content: "Menu";
 784         font: 14px/45px sans-serif !important;
 785         display: inline-block !important;
 786         color: #fff;
 787 }
 788
 789 .no-font-face #wpadminbar #wp-admin-bar-site-name a.ab-item {
 790         color: #fff;
 791 }
 792 /* End no @font-face */
 793
 794 @media screen and ( max-width: 782px ) {
 795         /* Toolbar Touchification*/
 796         html #wpadminbar {
 797                 height: 46px;
 798                 min-width: 300px;
 799
 800         /*      These rules break dropdown tappability on Chrome/Android.
 801                 -webkit-transform: translate3d(0, 0, 0);
 802                 -webkit-backface-visibility: hidden;
 803                 -webkit-transition: 0;
 804                 transform: translate3d(0, 0, 0);
 805                 backface-visibility: hidden;
 806                 transition: 0;
 807         */
 808         }
 809
 810         #wpadminbar * {
 811                 font-size: 14px;
 812                 font-weight: 400;
 813                 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 814                 line-height: 32px;
 815         }
 816
 817         #wpadminbar .quicklinks > ul > li > a,
 818         #wpadminbar .quicklinks .ab-empty-item {
 819                 padding: 0;
 820                 height: 46px;
 821                 line-height: 46px;
 822                 width: auto;
 823         }
 824
 825         #wpadminbar .ab-icon {
 826                 font: 40px/1 dashicons !important;
 827                 margin: 0;
 828                 padding: 0;
 829                 width: 52px;
 830                 height: 46px;
 831                 text-align: center;
 832         }
 833
 834         #wpadminbar .ab-icon:before {
 835                 text-align: center;
 836         }
 837
 838         #wpadminbar .ab-submenu {
 839                 padding: 0;
 840         }
 841
 842         #wpadminbar #wp-admin-bar-site-name a.ab-item,
 843         #wpadminbar #wp-admin-bar-my-sites a.ab-item,
 844         #wpadminbar #wp-admin-bar-my-account a.ab-item {
 845                 text-overflow: clip;
 846         }
 847
 848         #wpadminbar .ab-label {
 849                 display: none;
 850         }
 851
 852         #wpadminbar .menupop li:hover > .ab-sub-wrapper,
 853         #wpadminbar .menupop li.hover > .ab-sub-wrapper {
 854                 margin-top: -46px;
 855         }
 856
 857         #wpadminbar .ab-top-menu .menupop .ab-sub-wrapper .menupop > .ab-item {
 858                 padding-right: 30px;
 859         }
 860
 861         #wpadminbar .menupop .menupop > .ab-item:before {
 862                 top: 10px;
 863                 right: 6px;
 864         }
 865
 866         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper .ab-item {
 867                 font-size: 16px;
 868                 padding: 8px 16px;
 869         }
 870
 871         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper a:empty {
 872                 display: none;
 873         }
 874
 875         /* WP logo */
 876         #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
 877                 padding: 0;
 878         }
 879
 880         #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
 881                 padding: 0;
 882                 width: 52px;
 883                 height: 46px;
 884                 text-align: center;
 885                 vertical-align: top;
 886         }
 887
 888         #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
 889                 font: 28px/1 dashicons !important;
 890                 top: -3px;
 891         }
 892
 893         #wpadminbar .ab-icon,
 894         #wpadminbar .ab-item:before {
 895                 padding: 0;
 896         }
 897
 898         /* My Sites and "Site Title" menu */
 899         #wpadminbar #wp-admin-bar-my-sites > .ab-item,
 900         #wpadminbar #wp-admin-bar-site-name > .ab-item,
 901         #wpadminbar #wp-admin-bar-customize > .ab-item,
 902         #wpadminbar #wp-admin-bar-edit > .ab-item,
 903         #wpadminbar #wp-admin-bar-my-account > .ab-item {
 904                 text-indent: 100%;
 905                 white-space: nowrap;
 906                 overflow: hidden;
 907                 width: 52px;
 908                 padding: 0;
 909                 color: #a0a5aa; /* @todo not needed? this text is hidden */
 910                 position: relative;
 911         }
 912
 913         #wpadminbar > #wp-toolbar > #wp-admin-bar-root-default .ab-icon,
 914         #wpadminbar .ab-icon,
 915         #wpadminbar .ab-item:before {
 916                 padding: 0;
 917                 margin-right: 0;
 918         }
 919
 920         #wpadminbar #wp-admin-bar-edit > .ab-item:before,
 921         #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
 922         #wpadminbar #wp-admin-bar-site-name > .ab-item:before,
 923         #wpadminbar #wp-admin-bar-customize > .ab-item:before,
 924         #wpadminbar #wp-admin-bar-my-account > .ab-item:before {
 925                 display: block;
 926                 text-indent: 0;
 927                 font: normal 32px/1 dashicons;
 928                 speak: none;
 929                 top: 7px;
 930                 width: 52px;
 931                 text-align: center;
 932                 -webkit-font-smoothing: antialiased;
 933                 -moz-osx-font-smoothing: grayscale;
 934         }
 935
 936         #wpadminbar #wp-admin-bar-appearance {
 937                 margin-top: 0;
 938         }
 939
 940         #wpadminbar .quicklinks li .blavatar:before {
 941                 display: none;
 942         }
 943
 944         /* Search */
 945         #wpadminbar #wp-admin-bar-search {
 946                 display: none;
 947         }
 948
 949         /* New Content */
 950         #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
 951                 top: 0;
 952                 line-height: 53px;
 953                 height: 46px !important;
 954                 text-align: center;
 955                 width: 52px;
 956                 display: block;
 957         }
 958
 959         /* Updates */
 960         #wpadminbar #wp-admin-bar-updates {
 961                 text-align: center;
 962         }
 963
 964         #wpadminbar #wp-admin-bar-updates .ab-icon:before {
 965                 top: 3px;
 966         }
 967
 968         /* Comments */
 969         #wpadminbar #wp-admin-bar-comments .ab-icon {
 970                 margin: 0;
 971         }
 972
 973         #wpadminbar #wp-admin-bar-comments .ab-icon:before {
 974                 display: block;
 975                 font-size: 34px;
 976                 height: 46px;
 977                 line-height: 47px;
 978                 top: 0;
 979         }
 980
 981         /* My Account */
 982         #wpadminbar #wp-admin-bar-my-account > a {
 983                 position: relative;
 984                 white-space: nowrap;
 985                 text-indent: 150%; /* More than 100% indention is needed since this element has padding */
 986                 width: 28px;
 987                 padding: 0 10px;
 988                 overflow: hidden; /* Prevent link text from forcing horizontal scrolling on mobile */
 989         }
 990
 991         #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
 992                 position: absolute;
 993                 top: 13px;
 994                 right: 10px;
 995                 width: 26px;
 996                 height: 26px;
 997         }
 998
 999         #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
1000                 padding: 0;
1001         }
1002
1003         #wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
1004                 display: none;
1005         }
1006
1007         #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
1008                 margin: 0;
1009         }
1010
1011         #wpadminbar #wp-admin-bar-user-info .display-name {
1012                 height: auto;
1013                 font-size: 16px;
1014                 line-height: 24px;
1015                 color: #eee;
1016         }
1017
1018         #wpadminbar #wp-admin-bar-user-info a {
1019                 padding-top: 4px;
1020         }
1021
1022         #wpadminbar #wp-admin-bar-user-info .username {
1023                 line-height: 0.8 !important;
1024                 margin-bottom: -2px;
1025         }
1026
1027         /* Show only default top level items */
1028         #wp-toolbar > ul > li {
1029                 display: none;
1030         }
1031
1032         #wpadminbar li#wp-admin-bar-menu-toggle,
1033         #wpadminbar li#wp-admin-bar-wp-logo,
1034         #wpadminbar li#wp-admin-bar-my-sites,
1035         #wpadminbar li#wp-admin-bar-updates,
1036         #wpadminbar li#wp-admin-bar-site-name,
1037         #wpadminbar li#wp-admin-bar-customize,
1038         #wpadminbar li#wp-admin-bar-new-content,
1039         #wpadminbar li#wp-admin-bar-edit,
1040         #wpadminbar li#wp-admin-bar-comments,
1041         #wpadminbar li#wp-admin-bar-my-account {
1042                 display: block;
1043         }
1044
1045         /* Allow dropdown list items to appear normally */
1046         #wpadminbar li:hover ul li,
1047         #wpadminbar li.hover ul li,
1048         #wpadminbar li:hover ul li:hover ul li {
1049                 display: list-item;
1050         }
1051
1052         /* Override default min-width so dropdown lists aren't stretched
1053                 to 100% viewport width at responsive sizes. */
1054         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1055                 min-width: -webkit-fit-content;
1056                 min-width: -moz-fit-content;
1057                 min-width: fit-content;
1058         }
1059
1060         #wpadminbar ul#wp-admin-bar-root-default > li {
1061                 margin-right: 0;
1062         }
1063
1064         /* Experimental fix for touch toolbar dropdown positioning */
1065         #wpadminbar .ab-top-menu,
1066         #wpadminbar .ab-top-secondary,
1067         #wpadminbar #wp-admin-bar-wp-logo,
1068         #wpadminbar #wp-admin-bar-my-sites,
1069         #wpadminbar #wp-admin-bar-site-name,
1070         #wpadminbar #wp-admin-bar-updates,
1071         #wpadminbar #wp-admin-bar-comments,
1072         #wpadminbar #wp-admin-bar-new-content,
1073         #wpadminbar #wp-admin-bar-edit,
1074         #wpadminbar #wp-admin-bar-my-account {
1075                 position: static;
1076         }
1077
1078         #wpadminbar #wp-admin-bar-my-account {
1079                 float: right;
1080         }
1081
1082         .network-admin #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
1083                 margin-right: 0;
1084         }
1085
1086         /* Realign arrows on taller responsive submenus */
1087
1088         #wpadminbar .ab-top-secondary .menupop .menupop > .ab-item:before {
1089                 top: 10px;
1090                 left: 0;
1091         }
1092 }
1093
1094 /* Smartphone */
1095 @media screen and (max-width: 600px) {
1096         #wpadminbar {
1097                 position: absolute;
1098         }
1099
1100         #wp-responsive-overlay {
1101                 position: fixed;
1102                 top: 0;
1103                 left: 0;
1104                 width: 100%;
1105                 height: 100%;
1106                 z-index: 400;
1107         }
1108
1109         #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
1110                 width: 100%;
1111                 left: 0;
1112         }
1113
1114         #wpadminbar .menupop .menupop > .ab-item:before {
1115                 display: none;
1116         }
1117
1118         #wpadminbar #wp-admin-bar-wp-logo.menupop .ab-sub-wrapper {
1119                 margin-left: 0;
1120         }
1121
1122         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
1123                 margin: 0;
1124                 width: 100%;
1125                 top: auto;
1126                 left: auto;
1127                 position: relative;
1128         }
1129
1130         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper .ab-item {
1131                 font-size: 16px;
1132                 padding: 6px 15px 19px 30px;
1133         }
1134
1135         #wpadminbar li:hover ul li ul li {
1136                 display: list-item;
1137         }
1138
1139         #wpadminbar li#wp-admin-bar-wp-logo,
1140         #wpadminbar li#wp-admin-bar-updates {
1141                 display: none;
1142         }
1143
1144         /* Make submenus full-width at this size */
1145
1146         #wpadminbar .ab-top-menu > .menupop li > .ab-sub-wrapper {
1147                 position: static;
1148                 -webkit-box-shadow: none;
1149                 box-shadow: none;
1150         }
1151 }
1152
1153 /* Very narrow screens */
1154 @media screen and (max-width: 400px) {
1155         #wpadminbar li#wp-admin-bar-comments {
1156                 display: none;
1157         }
1158 }