[Summary view] [Print] [Text view]

   1  #customize-theme-controls #accordion-section-menu_locations {
   2      position: relative;
   3      margin-top: 30px;
   4  }
   5  
   6  #customize-theme-controls #accordion-section-menu_locations > .accordion-section-title {
   7      border-bottom-color: #dcdcde;
   8      margin-top: 15px;
   9  }
  10  
  11  #customize-theme-controls .customize-section-title-nav_menus-heading,
  12  #customize-theme-controls .customize-section-title-menu_locations-heading,
  13  #customize-theme-controls .customize-section-title-menu_locations-description {
  14      padding: 0 12px;
  15  }
  16  
  17  #customize-theme-controls .customize-control-description.customize-section-title-menu_locations-description {
  18      /* Override the default italic style for control descriptions */
  19      font-style: normal;
  20  }
  21  
  22  .menu-in-location,
  23  .menu-in-locations {
  24      display: block;
  25      font-weight: 600;
  26      font-size: 10px;
  27  }
  28  
  29  #customize-controls .theme-location-set,
  30  #customize-controls .control-section .accordion-section-title:focus .menu-in-location,
  31  #customize-controls .control-section .accordion-section-title:hover .menu-in-location {
  32      color: #50575e;
  33  }
  34  
  35  /* The `edit-menu` and `create-menu` buttons also use the `button-link` class. */
  36  .customize-control-nav_menu_location .edit-menu,
  37  .customize-control-nav_menu_location .create-menu {
  38      margin-left: 6px;
  39      vertical-align: middle;
  40      line-height: 2.2;
  41  }
  42  
  43  #customize-controls .customize-control-nav_menu_name {
  44      margin-bottom: 12px;
  45  }
  46  
  47  .customize-control-nav_menu_name p:last-of-type {
  48      margin-bottom: 0;
  49  }
  50  
  51  #customize-new-menu-submit {
  52      float: right;
  53      min-width: 85px;
  54  }
  55  
  56  .wp-customizer .menu-item-bar .menu-item-handle,
  57  .wp-customizer .menu-item-settings,
  58  .wp-customizer .menu-item-settings .description-thin {
  59      box-sizing: border-box;
  60  }
  61  
  62  .wp-customizer .menu-item-bar {
  63      margin: 0;
  64  }
  65  
  66  .wp-customizer .menu-item-bar .menu-item-handle {
  67      width: 100%;
  68      max-width: 100%;
  69      background: #fff;
  70  }
  71  
  72  .wp-customizer .menu-item-handle .item-title {
  73      margin-right: 0;
  74  }
  75  
  76  .wp-customizer .menu-item-handle .item-type {
  77      padding: 1px 21px 0 5px;
  78      float: right;
  79      text-align: right;
  80  }
  81  
  82  .wp-customizer .menu-item-handle:hover {
  83      z-index: 8;
  84  }
  85  
  86  .customize-control-nav_menu_item.has-notifications .menu-item-handle {
  87      border-left: 4px solid #72aee6;
  88  }
  89  
  90  .wp-customizer .menu-item-settings {
  91      max-width: 100%;
  92      overflow: hidden;
  93      z-index: 8;
  94      padding: 10px;
  95      background: #f0f0f1;
  96      border: 1px solid #8c8f94;
  97      border-top: none;
  98  }
  99  
 100  .wp-customizer .menu-item-settings .description-thin {
 101      width: 100%;
 102      height: auto;
 103      margin: 0 0 8px;
 104  }
 105  
 106  .wp-customizer .menu-item-settings input[type="text"] {
 107      width: 100%;
 108  }
 109  
 110  .wp-customizer .menu-item-settings .submitbox {
 111      margin: 0;
 112      padding: 0;
 113  }
 114  
 115  .wp-customizer .menu-item-settings .link-to-original {
 116      padding: 5px 0;
 117      border: none;
 118      font-style: normal;
 119      margin: 0;
 120      width: 100%;
 121  }
 122  
 123  .wp-customizer .menu-item .submitbox .submitdelete {
 124      float: left;
 125      margin: 6px 0 0;
 126      padding: 0;
 127      cursor: pointer;
 128  }
 129  
 130  
 131  /**
 132   * Menu items reordering styles
 133   */
 134  
 135  .menu-item-reorder-nav {
 136      display: none;
 137      background-color: #fff;
 138      position: absolute;
 139      top: 0;
 140      right: 0;
 141  }
 142  
 143  .menus-move-left:before {
 144      content: "\f341";
 145  }
 146  
 147  .menus-move-right:before {
 148      content: "\f345";
 149  }
 150  
 151  .reordering .menu-item .item-controls,
 152  .reordering .menu-item .item-type {
 153      display: none;
 154  }
 155  
 156  .reordering .menu-item-reorder-nav {
 157      display: block;
 158  }
 159  
 160  .customize-control input.menu-name-field {
 161      width: 100%; /* Override the 98% default for customizer inputs, to align with the size of menu items. */
 162  }
 163  
 164  .wp-customizer .menu-item .item-edit {
 165      position: absolute;
 166      right: -19px;
 167      top: 2px;
 168      display: block;
 169      width: 30px;
 170      height: 38px;
 171      margin-right: 0 !important;
 172      box-shadow: none;
 173      outline: none;
 174      overflow: hidden;
 175      cursor: pointer;
 176      text-align: center;
 177  }
 178  
 179  .wp-customizer .menu-item.menu-item-edit-active .item-edit .toggle-indicator:before {
 180      content: "\f142";
 181  }
 182  
 183  .wp-customizer .menu-item-settings p.description {
 184      font-style: normal;
 185  }
 186  
 187  .wp-customizer .menu-settings dl {
 188      margin: 12px 0 0;
 189      padding: 0;
 190  }
 191  
 192  .wp-customizer .menu-settings .checkbox-input {
 193      margin-top: 8px;
 194  }
 195  
 196  .wp-customizer .menu-settings .menu-theme-locations {
 197      border-top: 1px solid #c3c4c7;
 198  }
 199  
 200  .wp-customizer .menu-settings {
 201      margin-top: 36px;
 202      border-top: none;
 203  }
 204  
 205  .wp-customizer .menu-location-settings {
 206      margin-top: 12px;
 207      border-top: none;
 208  }
 209  
 210  .wp-customizer .control-section-nav_menu .menu-location-settings {
 211      margin-top: 24px;
 212      border-top: 1px solid #dcdcde;
 213  }
 214  
 215  .wp-customizer .control-section-nav_menu .menu-location-settings,
 216  .customize-control-nav_menu_auto_add {
 217      padding-top: 12px;
 218  }
 219  
 220  .menu-location-settings .customize-control-checkbox .theme-location-set {
 221      line-height: 1;
 222  }
 223  
 224  .customize-control-nav_menu_auto_add label {
 225      vertical-align: top;
 226  }
 227  
 228  .menu-location-settings .new-menu-locations-widget-note {
 229      display: block;
 230  }
 231  
 232  .customize-control-menu {
 233      margin-top: 4px;
 234  }
 235  
 236  #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle {
 237      color: #50575e;
 238  }
 239  
 240  /* Screen Options */
 241  .customize-screen-options-toggle {
 242      background: none;
 243      border: none;
 244      color: #50575e;
 245      cursor: pointer;
 246      margin: 0;
 247      padding: 20px;
 248      position: absolute;
 249      right: 0;
 250      top: 30px;
 251  }
 252  
 253  #customize-controls .customize-info .customize-help-toggle {
 254      padding: 20px;
 255  }
 256  
 257  #customize-controls .customize-info .customize-help-toggle:before {
 258      padding: 4px;
 259  }
 260  
 261  .customize-screen-options-toggle:hover,
 262  .customize-screen-options-toggle:active,
 263  .customize-screen-options-toggle:focus,
 264  .active-menu-screen-options .customize-screen-options-toggle,
 265  #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:hover,
 266  #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:active,
 267  #customize-controls .customize-info.open.active-menu-screen-options .customize-help-toggle:focus {
 268      color: #2271b1;
 269  }
 270  
 271  .customize-screen-options-toggle:focus,
 272  #customize-controls .customize-info .customize-help-toggle:focus {
 273      /* Only visible in Windows High Contrast mode */
 274      outline: 2px solid transparent;
 275  }
 276  
 277  .customize-screen-options-toggle:before {
 278      -moz-osx-font-smoothing: grayscale;
 279      border: none;
 280      content: "\f111";
 281      display: block;
 282      font: 18px/1 dashicons;
 283      padding: 5px;
 284      text-align: center;
 285      text-decoration: none !important;
 286      text-indent: 0;
 287      left: 6px;
 288      position: absolute;
 289      top: 6px;
 290  }
 291  
 292  .customize-screen-options-toggle:focus:before,
 293  #customize-controls .customize-info .customize-help-toggle:focus:before {
 294      border-radius: 100%;
 295  }
 296  
 297  .wp-customizer #screen-options-wrap {
 298      display: none;
 299      background: #fff;
 300      border-top: 1px solid #dcdcde;
 301      padding: 4px 15px 15px;
 302  }
 303  
 304  .wp-customizer .metabox-prefs label {
 305      display: block;
 306      padding-right: 0;
 307      line-height: 30px;
 308  }
 309  
 310  /* rework the arrow indicator implementation for NVDA bug same as #32715 */
 311  .wp-customizer .toggle-indicator {
 312      display: inline-block;
 313      font-size: 20px;
 314      line-height: 1;
 315  }
 316  
 317  .rtl .wp-customizer .toggle-indicator {
 318      text-indent: 1px; /* account for the dashicon alignment */
 319  }
 320  
 321  .wp-customizer .menu-item .item-edit .toggle-indicator:before,
 322  #available-menu-items .accordion-section-title .toggle-indicator:before {
 323      content: "\f140";
 324      display: block;
 325      padding: 1px 2px 1px 0;
 326      speak: never;
 327      border-radius: 50%;
 328      color: #787c82;
 329      font: normal 20px/1 dashicons;
 330      -webkit-font-smoothing: antialiased;
 331      -moz-osx-font-smoothing: grayscale;
 332      text-decoration: none !important;
 333  }
 334  
 335  .control-section-nav_menu .field-link-target,
 336  .control-section-nav_menu .field-title-attribute,
 337  .control-section-nav_menu .field-css-classes,
 338  .control-section-nav_menu .field-xfn,
 339  .control-section-nav_menu .field-description {
 340      display: none;
 341  }
 342  
 343  .control-section-nav_menu.field-link-target-active .field-link-target,
 344  .control-section-nav_menu.field-title-attribute-active .field-title-attribute,
 345  .control-section-nav_menu.field-css-classes-active .field-css-classes,
 346  .control-section-nav_menu.field-xfn-active .field-xfn,
 347  .control-section-nav_menu.field-description-active .field-description {
 348      display: block;
 349  }
 350  
 351  /* WARNING: The 20px factor is hard-coded in JS. */
 352  .menu-item-depth-0  { margin-left: 0;     }
 353  .menu-item-depth-1  { margin-left: 20px;  }
 354  .menu-item-depth-2  { margin-left: 40px;  }
 355  .menu-item-depth-3  { margin-left: 60px;  }
 356  .menu-item-depth-4  { margin-left: 80px;  }
 357  .menu-item-depth-5  { margin-left: 100px; }
 358  .menu-item-depth-6  { margin-left: 120px; }
 359  .menu-item-depth-7  { margin-left: 140px; }
 360  .menu-item-depth-8  { margin-left: 160px; } /* Not likely to be used or useful beyond this depth */
 361  .menu-item-depth-9  { margin-left: 180px; }
 362  .menu-item-depth-10 { margin-left: 200px; }
 363  .menu-item-depth-11 { margin-left: 220px; }
 364  
 365  /* @todo handle .menu-item-settings width */
 366  .menu-item-depth-0  > .menu-item-bar { margin-right: 0;     }
 367  .menu-item-depth-1  > .menu-item-bar { margin-right: 20px;  }
 368  .menu-item-depth-2  > .menu-item-bar { margin-right: 40px;  }
 369  .menu-item-depth-3  > .menu-item-bar { margin-right: 60px;  }
 370  .menu-item-depth-4  > .menu-item-bar { margin-right: 80px;  }
 371  .menu-item-depth-5  > .menu-item-bar { margin-right: 100px; }
 372  .menu-item-depth-6  > .menu-item-bar { margin-right: 120px; }
 373  .menu-item-depth-7  > .menu-item-bar { margin-right: 140px; }
 374  .menu-item-depth-8  > .menu-item-bar { margin-right: 160px; }
 375  .menu-item-depth-9  > .menu-item-bar { margin-right: 180px; }
 376  .menu-item-depth-10 > .menu-item-bar { margin-right: 200px; }
 377  .menu-item-depth-11 > .menu-item-bar { margin-right: 220px; }
 378  
 379  /* Submenu left margin. */
 380  .menu-item-depth-0  .menu-item-transport { margin-left: 0;      }
 381  .menu-item-depth-1  .menu-item-transport { margin-left: -20px;  }
 382  .menu-item-depth-3  .menu-item-transport { margin-left: -60px;  }
 383  .menu-item-depth-4  .menu-item-transport { margin-left: -80px;  }
 384  .menu-item-depth-2  .menu-item-transport { margin-left: -40px;  }
 385  .menu-item-depth-5  .menu-item-transport { margin-left: -100px; }
 386  .menu-item-depth-6  .menu-item-transport { margin-left: -120px; }
 387  .menu-item-depth-7  .menu-item-transport { margin-left: -140px; }
 388  .menu-item-depth-8  .menu-item-transport { margin-left: -160px; }
 389  .menu-item-depth-9  .menu-item-transport { margin-left: -180px; }
 390  .menu-item-depth-10 .menu-item-transport { margin-left: -200px; }
 391  .menu-item-depth-11 .menu-item-transport { margin-left: -220px; }
 392  
 393  /* WARNING: The 20px factor is hard-coded in JS. */
 394  .reordering .menu-item-depth-0  { margin-left: 0;     }
 395  .reordering .menu-item-depth-1  { margin-left: 15px;  }
 396  .reordering .menu-item-depth-2  { margin-left: 30px;  }
 397  .reordering .menu-item-depth-3  { margin-left: 45px;  }
 398  .reordering .menu-item-depth-4  { margin-left: 60px;  }
 399  .reordering .menu-item-depth-5  { margin-left: 75px;  }
 400  .reordering .menu-item-depth-6  { margin-left: 90px;  }
 401  .reordering .menu-item-depth-7  { margin-left: 105px; }
 402  .reordering .menu-item-depth-8  { margin-left: 120px; } /* Not likely to be used or useful beyond this depth */
 403  .reordering .menu-item-depth-9  { margin-left: 135px; }
 404  .reordering .menu-item-depth-10 { margin-left: 150px; }
 405  .reordering .menu-item-depth-11 { margin-left: 165px; }
 406  
 407  .reordering .menu-item-depth-0  > .menu-item-bar { margin-right: 0;     }
 408  .reordering .menu-item-depth-1  > .menu-item-bar { margin-right: 15px;  }
 409  .reordering .menu-item-depth-2  > .menu-item-bar { margin-right: 30px;  }
 410  .reordering .menu-item-depth-3  > .menu-item-bar { margin-right: 45px;  }
 411  .reordering .menu-item-depth-4  > .menu-item-bar { margin-right: 60px;  }
 412  .reordering .menu-item-depth-5  > .menu-item-bar { margin-right: 75px;  }
 413  .reordering .menu-item-depth-6  > .menu-item-bar { margin-right: 90px;  }
 414  .reordering .menu-item-depth-7  > .menu-item-bar { margin-right: 105px; }
 415  .reordering .menu-item-depth-8  > .menu-item-bar { margin-right: 120px; }
 416  .reordering .menu-item-depth-9  > .menu-item-bar { margin-right: 135px; }
 417  .reordering .menu-item-depth-10 > .menu-item-bar { margin-right: 150px; }
 418  .reordering .menu-item-depth-11 > .menu-item-bar { margin-right: 165px; }
 419  
 420  .control-section-nav_menu.menu .menu-item-edit-active {
 421      margin-left: 0;
 422  }
 423  
 424  .control-section-nav_menu.menu .menu-item-edit-active .menu-item-bar {
 425      margin-right: 0;
 426  }
 427  
 428  .control-section-nav_menu.menu .sortable-placeholder {
 429      margin-top: 0;
 430      margin-bottom: 1px;
 431      max-width: calc(100% - 2px);
 432      float: left;
 433      display: list-item;
 434      border-color: #a7aaad;
 435  }
 436  
 437  .menu-item-transport li.customize-control {
 438      float: none;
 439  }
 440  
 441  .control-section-nav_menu.menu ul.menu-item-transport .menu-item-bar {
 442      margin-top: 0;
 443  }
 444  
 445  /**
 446   * Add-menu-items mode
 447   */
 448  
 449  .adding-menu-items .control-section {
 450      opacity: .4;
 451  }
 452  
 453  .adding-menu-items .control-panel.control-section,
 454  .adding-menu-items .control-section.open {
 455      opacity: 1;
 456  }
 457  
 458  .menu-item-bar .item-delete {
 459      color: #d63638;
 460      position: absolute;
 461      top: 2px;
 462      right: -19px;
 463      width: 30px;
 464      height: 38px;
 465      cursor: pointer;
 466      display: none;
 467  }
 468  
 469  .menu-item-bar .item-delete:before {
 470      content: "\f335";
 471      position: absolute;
 472      top: 9px;
 473      left: 5px;
 474      border-radius: 50%;
 475      font: normal 20px/1 dashicons;
 476      -webkit-font-smoothing: antialiased;
 477      -moz-osx-font-smoothing: grayscale;
 478  }
 479  
 480  .menu-item-bar .item-delete:hover,
 481  .menu-item-bar .item-delete:focus {
 482      box-shadow: none;
 483      outline: none;
 484      color: #d63638;
 485  }
 486  
 487  .adding-menu-items .menu-item-bar .item-edit {
 488      display: none;
 489  }
 490  
 491  .adding-menu-items .menu-item-bar .item-delete {
 492      display: block;
 493  }
 494  
 495  /**
 496   * Styles for menu-item addition panel
 497   */
 498  
 499  #available-menu-items.opening {
 500      overflow-y: hidden; /* avoid scrollbar jitter with animating heights */
 501  }
 502  
 503  #available-menu-items #available-menu-items-search.open {
 504      height: 100%;
 505      border-bottom: none;
 506  }
 507  
 508  #available-menu-items .accordion-section-title {
 509      border-left: none;
 510      border-right: none;
 511      background: #fff;
 512      transition: background-color 0.15s;
 513      /* Reset the value inherited from the base .accordion-section-title style. Ticket #37589. */
 514      -webkit-user-select: auto;
 515      user-select: auto;
 516  }
 517  
 518  #available-menu-items .open .accordion-section-title,
 519  #available-menu-items #available-menu-items-search .accordion-section-title {
 520      background: #f0f0f1;
 521  }
 522  
 523  /* rework the arrow indicator implementation for NVDA bug see #32715 */
 524  #available-menu-items .accordion-section-title:after {
 525      content: none !important;
 526  }
 527  
 528  #available-menu-items .accordion-section-title:hover .toggle-indicator:before,
 529  #available-menu-items .button-link:hover .toggle-indicator:before,
 530  #available-menu-items .button-link:focus .toggle-indicator:before {
 531      color: #1d2327;
 532  }
 533  
 534  #available-menu-items .open .accordion-section-title .toggle-indicator:before {
 535      content: "\f142";
 536      color: #1d2327;
 537  }
 538  
 539  #available-menu-items .available-menu-items-list {
 540      overflow-y: auto;
 541      max-height: 200px; /* This gets set in JS to fit the screen size, and based on # of sections. */
 542      background: transparent;
 543  }
 544  
 545  #available-menu-items .accordion-section-title button {
 546      display: block;
 547      width: 28px;
 548      height: 35px;
 549      position: absolute;
 550      top: 5px;
 551      right: 5px;
 552      box-shadow: none;
 553      outline: none;
 554      cursor: pointer;
 555      text-align: center;
 556  }
 557  
 558  #available-menu-items .accordion-section-title .no-items,
 559  #available-menu-items .cannot-expand .accordion-section-title .spinner,
 560  #available-menu-items .cannot-expand .accordion-section-title > button {
 561      display: none;
 562  }
 563  
 564  #available-menu-items-search.cannot-expand .accordion-section-title .spinner {
 565      display: block;
 566  }
 567  
 568  #available-menu-items .cannot-expand .accordion-section-title .no-items {
 569      float: right;
 570      color: #50575e;
 571      font-weight: 400;
 572      margin-left: 5px;
 573  }
 574  
 575  #available-menu-items .accordion-section-content {
 576      max-height: 290px;
 577      margin: 0;
 578      padding: 0;
 579      position: relative;
 580      background: transparent;
 581  }
 582  
 583  #available-menu-items .accordion-section-content .available-menu-items-list {
 584      margin: 0 0 45px;
 585      padding: 1px 15px 15px;
 586  }
 587  
 588  #available-menu-items .accordion-section-content .available-menu-items-list:only-child { /* Types that do not support new items for the current user */
 589      margin-bottom: 0;
 590  }
 591  
 592  #new-custom-menu-item .accordion-section-content {
 593      padding: 0 15px 15px;
 594  }
 595  
 596  #available-menu-items .menu-item-tpl {
 597      margin: 0;
 598  }
 599  
 600  #custom-menu-item-name.invalid,
 601  #custom-menu-item-url.invalid,
 602  .edit-menu-item-url.invalid,
 603  .menu-name-field.invalid,
 604  .menu-name-field.invalid:focus,
 605  #available-menu-items .new-content-item .create-item-input.invalid,
 606  #available-menu-items .new-content-item .create-item-input.invalid:focus {
 607      border: 1px solid #d63638;
 608  }
 609  
 610  #available-menu-items .menu-item-handle .item-type {
 611      padding-right: 0;
 612  }
 613  
 614  #available-menu-items .menu-item-handle .item-title {
 615      padding-left: 20px;
 616  }
 617  
 618  #available-menu-items .menu-item-handle {
 619      cursor: pointer;
 620  }
 621  
 622  #available-menu-items .menu-item-handle {
 623      box-shadow: none;
 624      margin-top: -1px;
 625  }
 626  
 627  #available-menu-items .menu-item-handle:hover {
 628      z-index: 1;
 629  }
 630  
 631  #available-menu-items .item-title h4 {
 632      padding: 0 0 5px;
 633      font-size: 14px;
 634  }
 635  
 636  #available-menu-items .item-add {
 637      position: absolute;
 638      top: 1px;
 639      left: 1px;
 640      color: #8c8f94;
 641      width: 30px;
 642      height: 38px;
 643      box-shadow: none;
 644      outline: none;
 645      cursor: pointer;
 646      text-align: center;
 647  }
 648  
 649  #available-menu-items .menu-item-handle .item-add:focus {
 650      color: #1d2327;
 651  }
 652  
 653  #available-menu-items .item-add:before {
 654      content: "\f543";
 655      position: relative;
 656      left: 2px;
 657      top: 3px;
 658      display: inline-block;
 659      height: 20px;
 660      border-radius: 50%;
 661      font: normal 20px/1.05 dashicons; /* line height is to account for the dashicon's vertical alignment */
 662  }
 663  
 664  #available-menu-items .menu-item-handle.item-added .item-type,
 665  #available-menu-items .menu-item-handle.item-added .item-title,
 666  #available-menu-items .menu-item-handle.item-added:hover .item-add,
 667  #available-menu-items .menu-item-handle.item-added .item-add:focus {
 668      color: #8c8f94;
 669  }
 670  
 671  #available-menu-items .menu-item-handle.item-added .item-add:before {
 672      content: "\f147";
 673  }
 674  
 675  #available-menu-items .accordion-section-title.loading .spinner,
 676  #available-menu-items-search.loading .accordion-section-title .spinner {
 677      visibility: visible;
 678      margin: 0 20px;
 679  }
 680  
 681  #available-menu-items-search .spinner {
 682      position: absolute;
 683      top: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
 684      right: 21px;
 685      margin: 0 !important;
 686  }
 687  
 688  /* search results list */
 689  #available-menu-items #available-menu-items-search .accordion-section-content {
 690      position: absolute;
 691      left: 0;
 692      top: 60px; /* below title div / search input */
 693      bottom: 0; /* 100% height that still triggers lazy load */
 694      max-height: none;
 695      width: 100%;
 696      padding: 1px 15px 15px;
 697      box-sizing: border-box;
 698  }
 699  
 700  #available-menu-items-search .nothing-found {
 701      /* Compensate the 1px top padding of the container. */
 702      margin-top: -1px;
 703  }
 704  
 705  #available-menu-items-search .accordion-section-title:after {
 706      display: none;
 707  }
 708  
 709  #available-menu-items-search .accordion-section-content:empty {
 710      min-height: 0;
 711      padding: 0;
 712  }
 713  
 714  #available-menu-items-search.loading .accordion-section-content div {
 715      opacity: .5;
 716  }
 717  
 718  #available-menu-items-search.loading.loading-more .accordion-section-content div {
 719      opacity: 1;
 720  }
 721  
 722  #customize-preview {
 723      transition: all 0.2s;
 724  }
 725  
 726  body.adding-menu-items #available-menu-items {
 727      left: 0;
 728      visibility: visible;
 729  }
 730  
 731  body.adding-menu-items .wp-full-overlay-main {
 732      left: 300px;
 733  }
 734  
 735  body.adding-menu-items #customize-preview {
 736      opacity: 0.4;
 737  }
 738  
 739  body.adding-menu-items #customize-preview iframe {
 740      pointer-events: none;
 741  }
 742  
 743  .menu-item-handle .spinner {
 744      display: none;
 745      float: left;
 746      margin: 0 8px 0 0;
 747  }
 748  
 749  .nav-menu-inserted-item-loading .spinner {
 750      display: block;
 751  }
 752  
 753  .nav-menu-inserted-item-loading .menu-item-handle .item-type {
 754      padding: 0 0 0 8px;
 755  }
 756  
 757  .nav-menu-inserted-item-loading .menu-item-handle,
 758  .added-menu-item .menu-item-handle.loading {
 759      padding: 10px 15px 10px 8px;
 760      cursor: default;
 761      opacity: .5;
 762      background: #fff;
 763      color: #787c82;
 764  }
 765  
 766  .added-menu-item .menu-item-handle {
 767      transition-property: opacity, background, color;
 768      transition-duration: 1.25s;
 769      transition-timing-function: cubic-bezier( .25, -2.5, .75, 8 ); /* Replacement for .hide().fadeIn('slow') in JS to add emphasis when it's loaded. */
 770  }
 771  
 772  /* Add/delete Menus */
 773  
 774  #customize-theme-controls .control-panel-content .control-section-nav_menu:nth-last-child(2) .accordion-section-title {
 775      border-bottom-color: #dcdcde;
 776  }
 777  
 778  /* @todo update selector */
 779  #accordion-section-add_menu {
 780      margin: 15px 12px;
 781  }
 782  
 783  #accordion-section-add_menu h3 {
 784      text-align: right;
 785  }
 786  
 787  #accordion-section-add_menu h3,
 788  #accordion-section-add_menu .customize-add-menu-button {
 789      margin: 0;
 790  }
 791  
 792  #accordion-section-add_menu .customize-add-menu-button {
 793      font-weight: 400;
 794  }
 795  
 796  #create-new-menu-submit {
 797      float: right;
 798      margin: 0 0 12px;
 799  }
 800  
 801  .menu-delete-item {
 802      float: left;
 803      padding: 1em 0;
 804      width: 100%;
 805  }
 806  
 807  .assigned-menu-locations-title p {
 808      margin: 0 0 8px;
 809  }
 810  
 811  li.assigned-to-menu-location .menu-delete-item {
 812      display: none;
 813  }
 814  
 815  li.assigned-to-menu-location .add-new-menu-item {
 816      margin-bottom: 1em;
 817  }
 818  
 819  .menu-item-handle {
 820      margin-top: -1px;
 821  }
 822  .ui-sortable-disabled .menu-item-handle {
 823      cursor: default;
 824  }
 825  
 826  .menu-item-handle:hover {
 827      position: relative;
 828      z-index: 10;
 829      color: #2271b1;
 830  }
 831  
 832  .menu-item-handle:hover .item-type,
 833  .menu-item-handle:hover .item-edit,
 834  #available-menu-items .menu-item-handle:hover .item-add {
 835      color: #2271b1;
 836  }
 837  
 838  .menu-item-edit-active .menu-item-handle {
 839      border-color: #8c8f94;
 840      border-bottom: none;
 841  }
 842  
 843  .customize-control-nav_menu_item {
 844      margin-bottom: 0;
 845  }
 846  
 847  .customize-control-nav_menu .new-menu-item-invitation {
 848      margin-top: 0;
 849      margin-bottom: 0;
 850  }
 851  
 852  .customize-control-nav_menu .customize-control-nav_menu-buttons {
 853      margin-top: 12px;
 854  }
 855  
 856  /**
 857   * box-shadows
 858   */
 859  
 860  .wp-customizer .menu-item .submitbox .submitdelete:focus,
 861  .customize-screen-options-toggle:focus:before,
 862  #customize-controls .customize-info .customize-help-toggle:focus:before,
 863  .wp-customizer button:focus .toggle-indicator:before,
 864  .menu-delete:focus,
 865  .menu-item-bar .item-delete:focus:before,
 866  #available-menu-items .item-add:focus:before {
 867      box-shadow: 0 0 0 2px #2271b1;
 868      /* Only visible in Windows High Contrast mode */
 869      outline: 2px solid transparent;
 870  }
 871  
 872  
 873  @media screen and (max-width: 782px) {
 874      #available-menu-items #available-menu-items-search .accordion-section-content {
 875          top: 63px;
 876      }
 877  }
 878  
 879  @media screen and (max-width: 640px) {
 880      #available-menu-items #available-menu-items-search .accordion-section-content {
 881          top: 130px;
 882      }
 883  }