/wp-admin/css/media-rtl.css

   1/*------------------------------------------------------------------------------
   2  14.0 - Media Screen
   3------------------------------------------------------------------------------*/
   4
   5.media-item .describe {
   6	border-collapse: collapse;
   7	width: 100%;
   8	border-top: 1px solid #ddd;
   9	clear: both;
  10	cursor: default;
  11}
  12
  13.media-item.media-blank .describe {
  14	border: 0;
  15}
  16
  17.media-item .describe th {
  18	vertical-align: top;
  19	text-align: right;
  20	padding: 5px 10px 10px;
  21	width: 140px;
  22}
  23
  24.media-item .describe .align th {
  25	padding-top: 0;
  26}
  27
  28.media-item .media-item-info tr {
  29	background-color: transparent;
  30}
  31
  32.media-item .describe td {
  33	padding: 0 0 8px 8px;
  34	vertical-align: top;
  35}
  36
  37.media-item thead.media-item-info td {
  38	padding: 4px 10px 0;
  39}
  40
  41.media-item .media-item-info .A1B1 {
  42	padding: 0 10px 0 0;
  43}
  44
  45.media-item td.savesend {
  46	padding-bottom: 15px;
  47}
  48
  49.media-item .thumbnail {
  50	max-height: 128px;
  51	max-width: 128px;
  52}
  53
  54#wpbody-content #async-upload-wrap a {
  55	display: none;
  56}
  57
  58.media-upload-form {
  59	margin-top: 20px;
  60}
  61
  62.media-upload-form td label {
  63	margin-left: 6px;
  64	margin-right: 2px;
  65}
  66
  67.media-upload-form .align .field label {
  68	display: inline;
  69	padding: 0 23px 0 0;
  70	margin: 0 3px 0 1em;
  71	font-weight: 600;
  72}
  73
  74.media-upload-form tr.image-size label {
  75	margin: 0 5px 0 0;
  76	font-weight: 600;
  77}
  78
  79.media-upload-form th.label label {
  80	font-weight: 600;
  81	margin: 0.5em;
  82	font-size: 13px;
  83}
  84
  85.media-upload-form th.label label span {
  86	padding: 0 5px;
  87}
  88
  89.media-item .describe input[type="text"],
  90.media-item .describe textarea {
  91	width: 460px;
  92}
  93
  94.media-item .describe p.help {
  95	margin: 0;
  96	padding: 0 5px 0 0;
  97}
  98
  99.media-item .edit-attachment,
 100.describe-toggle-on,
 101.describe-toggle-off {
 102	display: block;
 103	line-height: 36px;
 104	float: left;
 105	margin-left: 10px;
 106}
 107
 108.media-item .describe-toggle-off,
 109.media-item.open .describe-toggle-on {
 110	display: none;
 111}
 112
 113.media-item.open .describe-toggle-off {
 114	display: block;
 115}
 116
 117.media-upload-form .media-item {
 118	min-height: 36px;
 119	margin-bottom: 1px;
 120	position: relative;
 121	width: 100%;
 122	background: #fff;
 123}
 124
 125.media-upload-form .media-item,
 126.media-upload-form .media-item .error {
 127	box-shadow: 0 1px 0 #ddd;
 128}
 129
 130#media-items:empty {
 131	border: 0 none;
 132}
 133
 134.media-item .filename {
 135	line-height: 36px;
 136	overflow: hidden;
 137	margin-right: 6px;
 138}
 139
 140.media-item .pinkynail {
 141	float: right;
 142	margin: 2px 3px 0 10px;
 143	max-width: 40px;
 144	max-height: 32px;
 145}
 146
 147.media-item .startopen,
 148.media-item .startclosed {
 149	display: none;
 150}
 151
 152.media-item .original {
 153	position: relative;
 154	height: 34px;
 155}
 156
 157.media-item .progress {
 158	float: left;
 159	height: 22px;
 160	margin: 7px 6px;
 161	width: 200px;
 162	line-height: 2em;
 163	padding: 0;
 164	overflow: hidden;
 165	border-radius: 22px;
 166	background: #ddd;
 167	box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
 168}
 169
 170.media-item .bar {
 171	z-index: 9;
 172	width: 0;
 173	height: 100%;
 174	margin-top: -22px;
 175	border-radius: 22px;
 176	background-color: #0073aa;
 177	box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
 178}
 179
 180.media-item .progress .percent {
 181	z-index: 10;
 182	position: relative;
 183	width: 200px;
 184	padding: 0;
 185	color: #fff;
 186	text-align: center;
 187	line-height: 22px;
 188	font-weight: 400;
 189	text-shadow: 0 1px 2px rgba(0,0,0,0.2);
 190}
 191
 192.upload-php .fixed .column-parent {
 193	width: 15%;
 194}
 195
 196.js .html-uploader #plupload-upload-ui {
 197	display: none;
 198}
 199
 200.js .html-uploader #html-upload-ui {
 201	display: block;
 202}
 203
 204.media-upload-form .media-item.error,
 205.media-upload-form .media-item .error {
 206	width: auto;
 207	margin: 0 0 1px 0;
 208}
 209
 210.media-upload-form .media-item .error {
 211	padding: 10px 14px 10px 0;
 212}
 213
 214.media-item .error-div a.dismiss {
 215	display: block;
 216	float: left;
 217	margin: 0 15px 0 10px;
 218}
 219
 220/*------------------------------------------------------------------------------
 221  14.1 - Media Library
 222------------------------------------------------------------------------------*/
 223
 224.find-box {
 225	background-color: #fff;
 226	box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
 227	width: 600px;
 228	overflow: hidden;
 229	margin-right: -300px;
 230	position: fixed;
 231	top: 30px;
 232	bottom: 30px;
 233	right: 50%;
 234	z-index: 100105;
 235}
 236
 237.find-box-head {
 238	background: #fcfcfc;
 239	border-bottom: 1px solid #ddd;
 240	height: 36px;
 241	font-size: 18px;
 242	font-weight: 600;
 243	line-height: 36px;
 244	padding: 0 16px 0 36px;
 245	position: absolute;
 246	top: 0;
 247	right: 0;
 248	left: 0;
 249}
 250
 251.find-box-inside {
 252	overflow: auto;
 253	padding: 16px;
 254	background-color: #fff;
 255	position: absolute;
 256	top: 37px;
 257	bottom: 45px;
 258	overflow-y: scroll;
 259	width: 100%;
 260	box-sizing: border-box;
 261}
 262
 263.find-box-search {
 264	padding-bottom: 16px;
 265}
 266
 267.find-box-search .spinner {
 268	float: none;
 269	right: 105px;
 270	position: absolute;
 271}
 272
 273.find-box-search,
 274#find-posts-response {
 275	position: relative; /* RTL fix, #WP28010 */
 276}
 277
 278#find-posts-input,
 279#find-posts-search {
 280	float: right;
 281}
 282
 283#find-posts-input {
 284	width: 140px;
 285	height: 28px;
 286	margin: 0 0 0 4px;
 287}
 288
 289.widefat .found-radio {
 290	padding-left: 0;
 291	width: 16px;
 292}
 293
 294#find-posts-close {
 295	width: 36px;
 296	height: 36px;
 297	border: none;
 298	padding: 0;
 299	position: absolute;
 300	top: 0;
 301	left: 0;
 302	cursor: pointer;
 303	text-align: center;
 304	background: none;
 305	color: #666;
 306}
 307
 308#find-posts-close:hover,
 309#find-posts-close:focus {
 310	color: #00a0d2;
 311}
 312
 313#find-posts-close:focus {
 314	outline: none;
 315	box-shadow:
 316		0 0 0 1px #5b9dd9,
 317		0 0 2px 1px rgba(30, 140, 190, .8);
 318}
 319
 320#find-posts-close:before {
 321	font: normal 20px/36px dashicons;
 322	vertical-align: top;
 323	speak: none;
 324	-webkit-font-smoothing: antialiased;
 325	-moz-osx-font-smoothing: grayscale;
 326	content: "\f158";
 327}
 328
 329.find-box-buttons {
 330	padding: 8px 16px;
 331	background: #fcfcfc;
 332	border-top: 1px solid #ddd;
 333	position: absolute;
 334	bottom: 0;
 335	right: 0;
 336	left: 0;
 337}
 338
 339@media screen and ( max-width: 782px ) {
 340	.find-box-inside {
 341		bottom: 57px;
 342	}
 343}
 344
 345@media screen and ( max-width: 660px ) {
 346
 347	.find-box {
 348		top: 0;
 349		bottom: 0;
 350		right: 0;
 351		left: 0;
 352		margin: 0;
 353		width: 100%;
 354	}
 355
 356}
 357
 358.ui-find-overlay {
 359	position: fixed;
 360	top: 0;
 361	right: 0;
 362	left: 0;
 363	bottom: 0;
 364	background: #000;
 365	opacity: 0.7;
 366	filter: alpha(opacity=70);
 367	z-index: 100100;
 368}
 369
 370ul#dismissed-updates {
 371	display: none;
 372}
 373
 374form.upgrade {
 375	margin-top: 8px;
 376}
 377
 378form.upgrade .hint {
 379	font-style: italic;
 380	font-size: 85%;
 381	margin: -0.5em 0 2em 0;
 382}
 383
 384#poststuff .inside .the-tagcloud {
 385	margin: 5px 0 10px;
 386	padding: 8px;
 387	border: 1px solid #ddd;
 388	line-height: 1.8em;
 389	word-spacing: 3px;
 390}
 391
 392.drag-drop #drag-drop-area {
 393	border: 4px dashed #b4b9be;
 394	height: 200px;
 395}
 396
 397.drag-drop .drag-drop-inside {
 398	margin: 70px auto 0;
 399	width: 250px;
 400}
 401
 402.drag-drop-inside p {
 403	color: #a0a5aa;
 404	font-size: 14px;
 405	margin: 5px 0;
 406	display: none;
 407}
 408
 409.drag-drop .drag-drop-inside p {
 410	text-align: center;
 411}
 412
 413.drag-drop-inside p.drag-drop-info {
 414	font-size: 20px;
 415}
 416
 417.drag-drop .drag-drop-inside p,
 418.drag-drop-inside p.drag-drop-buttons {
 419	display: block;
 420}
 421
 422/*
 423#drag-drop-area:-moz-drag-over {
 424	border-color: #83b4d8;
 425}
 426border color while dragging a file over the uploader drop area */
 427.drag-drop.drag-over #drag-drop-area {
 428	border-color: #83b4d8;
 429}
 430
 431#plupload-upload-ui {
 432	position: relative;
 433}
 434
 435/**
 436 * Media Library grid view
 437 */
 438
 439.media-frame.mode-grid,
 440.media-frame.mode-grid .media-frame-content,
 441.media-frame.mode-grid .attachments-browser .attachments,
 442.media-frame.mode-grid .uploader-inline-content {
 443	position: static;
 444}
 445
 446/* Regions we don't use at all */
 447.media-frame.mode-grid .media-frame-title,
 448.media-frame.mode-grid .media-frame-router,
 449.media-frame.mode-grid .media-frame-menu {
 450	display: none;
 451}
 452
 453.media-frame.mode-grid .media-frame-content {
 454	background-color: transparent;
 455	border: none;
 456}
 457
 458.upload-php .mode-grid .media-sidebar {
 459	position: relative;
 460	width: auto;
 461	margin-top: 12px;
 462	padding: 0 16px;
 463	border-right: 4px solid #dd3d36;
 464 	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
 465	background-color: #fff;
 466}
 467
 468.upload-php .mode-grid .hide-sidebar .media-sidebar {
 469	display: none;
 470}
 471
 472.upload-php .mode-grid .media-sidebar .media-uploader-status {
 473	border-bottom: none;
 474	padding-bottom: 0;
 475	max-width: 100%;
 476}
 477
 478.upload-php .mode-grid .media-sidebar .upload-error {
 479	margin: 12px 0;
 480	padding: 4px 0 0;
 481	border: none;
 482	box-shadow: none;
 483	background: none;
 484}
 485
 486.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors {
 487	top: -10px;
 488	left: -14px;
 489	padding: 10px;
 490}
 491
 492.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:before {
 493	content: "\f153";
 494	display: block;
 495	font: normal 16px/1 dashicons;
 496	color: #72777c;
 497}
 498
 499.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before,
 500.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before {
 501	color: #c00;
 502}
 503
 504.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h3, /* Back-compat for pre-4.4 */
 505.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h2 {
 506	display: none;
 507}
 508
 509.media-frame.mode-grid .uploader-inline {
 510	position: relative;
 511	top: auto;
 512	left: auto;
 513	right: auto;
 514	bottom: auto;
 515	padding-top: 0;
 516	margin-top: 20px;
 517	border: 4px dashed #b4b9be;
 518}
 519
 520.media-frame.mode-select .attachments-browser.fixed .attachments {
 521	position: relative;
 522	top: 94px; /* prevent jumping up when the toolbar becomes fixed */
 523	padding-bottom: 94px; /* offset for above so the bottom doesn't get cut off */
 524}
 525
 526.media-frame.mode-grid .attachment:focus,
 527.media-frame.mode-grid .selected.attachment:focus,
 528.media-frame.mode-grid .attachment.details:focus {
 529	box-shadow:
 530		inset 0 0 2px 3px #f1f1f1,
 531		inset 0 0 0 7px #5b9dd9;
 532	outline: none;
 533}
 534
 535.media-frame.mode-grid .selected.attachment {
 536	box-shadow:
 537		inset 0 0 0 5px #f1f1f1,
 538		inset 0 0 0 7px #ccc;
 539}
 540
 541.media-frame.mode-grid .attachment.details {
 542	box-shadow:
 543		inset 0 0 0 3px #f1f1f1,
 544		inset 0 0 0 7px #1e8cbe;
 545}
 546
 547.media-frame.mode-grid.mode-select .attachment .thumbnail {
 548	opacity: 0.65;
 549}
 550
 551.media-frame.mode-select .attachment.selected .thumbnail {
 552	opacity: 1;
 553}
 554
 555.media-frame.mode-grid .media-toolbar {
 556	margin-bottom: 15px;
 557	height: auto;
 558}
 559
 560.media-frame.mode-grid .media-toolbar select {
 561	margin: 0 0 0 10px;
 562	font-size: 14px;
 563}
 564
 565.media-frame.mode-grid.mode-edit .media-toolbar-secondary > .select-mode-toggle-button {
 566	margin: 0 0 0 8px;
 567	vertical-align: middle;
 568}
 569
 570.media-frame.mode-grid .attachments-browser .bulk-select {
 571	display: inline-block;
 572	margin: 0 0 0 10px;
 573}
 574
 575.media-frame.mode-grid .search {
 576	margin-top: 0;
 577}
 578
 579.media-frame.mode-grid .spinner {
 580	margin-top: 16px;
 581}
 582
 583.attachments-browser .media-toolbar-secondary > .media-button {
 584	margin-left: 10px;
 585}
 586
 587.media-frame.mode-select .attachments-browser.fixed .media-toolbar {
 588	position: fixed;
 589	top: 32px;
 590	right: auto;
 591	left: 20px;
 592	margin-top: 0;
 593}
 594
 595.media-frame.mode-grid .attachments-browser {
 596	padding: 0;
 597}
 598
 599.media-frame.mode-grid .attachments-browser .attachments {
 600	padding: 2px;
 601}
 602
 603.media-frame.mode-grid .attachments-browser .no-media {
 604	color: #666; /* same as no plugins and no themes */
 605	font-size: 18px;
 606	font-style: normal;
 607	margin: 0;
 608	padding: 100px 0 0;
 609	text-align: center;
 610}
 611
 612/**
 613 * Attachment details modal
 614 */
 615
 616.edit-attachment-frame {
 617	display: block;
 618	height: 100%;
 619	width: 100%;
 620}
 621
 622.edit-attachment-frame .edit-media-header {
 623	overflow: hidden;
 624}
 625
 626.upload-php .media-modal-close .media-modal-icon:before {
 627	content: "\f335";
 628	font-size: 22px;
 629}
 630
 631.upload-php .media-modal-close,
 632.edit-attachment-frame .edit-media-header .left,
 633.edit-attachment-frame .edit-media-header .right {
 634	cursor: pointer;
 635	color: #72777c;
 636	background-color: transparent;
 637	height: 50px;
 638	width: 50px;
 639	padding: 0;
 640	position: absolute;
 641	text-align: center;
 642	border: 0;
 643	border-right: 1px solid #ddd;
 644	transition: color .1s ease-in-out, background .1s ease-in-out;
 645}
 646
 647.upload-php .media-modal-close {
 648	top: 0;
 649	left: 0;
 650}
 651
 652.edit-attachment-frame .edit-media-header .left {
 653	left: 102px;
 654}
 655
 656.edit-attachment-frame .edit-media-header .right {
 657	left: 51px;
 658}
 659
 660.edit-attachment-frame .media-frame-title {
 661	right: 0;
 662	left: 150px; /* leave space for prev/next/close */
 663}
 664
 665.edit-attachment-frame .edit-media-header .right:before,
 666.edit-attachment-frame .edit-media-header .left:before {
 667	font: normal 20px/50px dashicons !important;
 668	display: inline;
 669	font-weight: 300;
 670}
 671
 672.upload-php .media-modal-close:hover,
 673.upload-php .media-modal-close:focus,
 674.edit-attachment-frame .edit-media-header .left:hover,
 675.edit-attachment-frame .edit-media-header .right:hover,
 676.edit-attachment-frame .edit-media-header .left:focus,
 677.edit-attachment-frame .edit-media-header .right:focus {
 678	background: #ddd;
 679	border-color: #ccc;
 680	color: #000;
 681	outline: none;
 682	box-shadow: none;
 683}
 684
 685.upload-php .media-modal-close:focus .media-modal-icon:before,
 686.upload-php .media-modal-close:hover .media-modal-icon:before {
 687	color: #000;
 688}
 689
 690.edit-attachment-frame .edit-media-header .left:before,
 691.rtl .edit-attachment-frame .edit-media-header .right:before {
 692	content: "\f345";
 693}
 694
 695.edit-attachment-frame .edit-media-header .right:before,
 696.rtl .edit-attachment-frame .edit-media-header .left:before {
 697	content: "\f341";
 698}
 699
 700.edit-attachment-frame .edit-media-header .left.disabled,
 701.edit-attachment-frame .edit-media-header .right.disabled,
 702.edit-attachment-frame .edit-media-header .left.disabled:hover,
 703.edit-attachment-frame .edit-media-header .right.disabled:hover {
 704	color: #ccc;
 705	background: inherit;
 706	cursor: default;
 707	pointer-events: none;
 708}
 709
 710.edit-attachment-frame .media-frame-content,
 711.edit-attachment-frame .media-frame-router {
 712	right: 0;
 713}
 714
 715.edit-attachment-frame .media-frame-content {
 716	border-bottom: none;
 717	bottom: 0;
 718	top: 50px;
 719}
 720
 721.edit-attachment-frame .attachment-details {
 722	position: absolute;
 723	overflow: auto;
 724	top: 0;
 725	bottom: 0;
 726	left: 0;
 727	right: 0;
 728	box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1);
 729}
 730
 731.edit-attachment-frame .attachment-media-view {
 732	float: right;
 733	width: 65%;
 734	height: 100%;
 735}
 736
 737.edit-attachment-frame .attachment-media-view .thumbnail {
 738	box-sizing: border-box;
 739	padding: 16px;
 740	height: 100%;
 741}
 742
 743.edit-attachment-frame .attachment-media-view .details-image {
 744	display: block;
 745	margin: 0 auto 16px;
 746	max-width: 100%;
 747	max-height: 90%;
 748	max-height: calc( 100% - 42px ); /* leave space for actions underneath */
 749	background-image: linear-gradient(-45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(-45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
 750	background-position: 100% 0, 10px 10px;
 751	background-size: 20px 20px;
 752}
 753
 754.edit-attachment-frame .attachment-media-view .attachment-actions {
 755	text-align: center;
 756}
 757
 758.edit-attachment-frame .wp-media-wrapper {
 759	margin-bottom: 12px;
 760}
 761
 762.edit-attachment-frame input,
 763.edit-attachment-frame textarea {
 764	padding: 6px 8px;
 765	line-height: 16px;
 766}
 767
 768.edit-attachment-frame .attachment-info {
 769	overflow: auto;
 770	box-sizing: border-box;
 771	margin-bottom: 0;
 772	padding: 12px 16px 0;
 773	width: 35%;
 774	height: 100%;
 775	box-shadow: inset 0px 4px 4px -4px rgba(0, 0, 0, 0.1);
 776	border-bottom: 0;
 777	border-right: 1px solid #ddd;
 778	background: #f3f3f3;
 779}
 780
 781.edit-attachment-frame .attachment-info .details,
 782.edit-attachment-frame .attachment-info .settings {
 783	position: relative; /* RTL fix, #WP29352 */
 784	overflow: hidden;
 785	float: none;
 786	margin-bottom: 15px;
 787	padding-bottom: 15px;
 788	border-bottom: 1px solid #ddd;
 789}
 790
 791.edit-attachment-frame .attachment-info .filename {
 792	font-weight: 400;
 793	color: #666;
 794}
 795
 796.edit-attachment-frame .attachment-info .thumbnail {
 797	margin-bottom: 12px;
 798}
 799
 800.attachment-info .actions {
 801	margin-bottom: 16px;
 802}
 803
 804.attachment-info .actions a {
 805	display: inline;
 806	text-decoration: none;
 807}
 808
 809
 810/*------------------------------------------------------------------------------
 811  14.2 - Image Editor
 812------------------------------------------------------------------------------*/
 813
 814.wp_attachment_details label[for="content"] {
 815	font-size: 13px;
 816	line-height: 1.5;
 817	margin: 1em 0;
 818}
 819
 820.wp_attachment_details #attachment_caption {
 821	height: 4em;
 822}
 823
 824.describe .image-editor {
 825	vertical-align: top;
 826}
 827
 828.imgedit-wrap {
 829	position: relative;
 830	padding-top: 10px;
 831}
 832
 833.imgedit-settings p,
 834.imgedit-settings fieldset {
 835	margin: 8px 0;
 836}
 837
 838.imgedit-settings legend {
 839	margin-bottom: 5px;
 840}
 841
 842.describe .imgedit-wrap .imgedit-settings {
 843	padding: 0 5px;
 844}
 845
 846.wp_attachment_holder div.updated {
 847	margin-top: 0;
 848}
 849
 850.wp_attachment_holder .imgedit-wrap > div {
 851	height: auto;
 852}
 853
 854.wp_attachment_holder .imgedit-wrap .imgedit-panel-content {
 855	padding: 3px 0 0 16px;
 856	float: right;
 857}
 858
 859.wp_attachment_holder .imgedit-wrap .imgedit-settings {
 860	float: left;
 861	width: 250px;
 862}
 863
 864.imgedit-settings input {
 865	margin-top: 0;
 866	vertical-align: middle;
 867}
 868
 869.imgedit-wait {
 870	position: absolute;
 871	top: 0;
 872	bottom: 0;
 873	width: 100%;
 874	background: #fff;
 875	opacity: 0.7;
 876	filter: alpha(opacity=70);
 877	display: none;
 878}
 879
 880.imgedit-wait:before {
 881	content: "";
 882	display: block;
 883	width: 20px;
 884	height: 20px;
 885	position: absolute;
 886	right: 50%;
 887	top: 50%;
 888	margin: -10px -10px 0 0;
 889	background: transparent url(../images/spinner.gif) no-repeat center;
 890	background-size: 20px 20px;
 891	-webkit-transform: translateZ(0);
 892	transform: translateZ(0);
 893}
 894
 895.no-float {
 896	float: none;
 897}
 898
 899.media-disabled,
 900.imgedit-settings .disabled {
 901	/* WCAG 1.4.3 Text or images of text that are part of an inactive user
 902	   interface component ... have no contrast requirement. */
 903	color: #a0a5aa;
 904}
 905
 906.A1B1 {
 907	overflow: hidden;
 908}
 909
 910.wp_attachment_image .button,
 911.A1B1 .button {
 912	float: right;
 913}
 914
 915.no-js .wp_attachment_image .button {
 916	display: none;
 917}
 918
 919.wp_attachment_image .spinner,
 920.A1B1 .spinner {
 921	float: right;
 922}
 923
 924.imgedit-menu {
 925	min-width: 300px;
 926	margin: 0 0 12px;
 927}
 928
 929.imgedit-menu .note-no-rotate {
 930	clear: both;
 931	margin: 0;
 932	padding: 1em 0 0;
 933}
 934
 935.image-editor .imgedit-menu .button {
 936	float: right;
 937	width: 32px;
 938	height: 32px;
 939	margin: 0 0 0 8px;
 940	padding: 0;
 941	background: #f1f1f1;
 942	-webkit-font-smoothing: antialiased;
 943	-moz-osx-font-smoothing: grayscale;
 944	line-height: 16px;
 945	color: #72777c;
 946}
 947
 948.imgedit-menu .button:before {
 949	font: normal 20px/1 dashicons;
 950	speak: none;
 951	vertical-align: middle;
 952}
 953
 954.imgedit-menu .button.disabled {
 955	border-color: #ccc;
 956	background-color: #ddd;
 957	color: #72777c;
 958	filter: alpha(opacity=50);
 959	opacity: 0.5;
 960	cursor: default;
 961}
 962
 963.imgedit-crop:before {
 964	content: "\f165";
 965}
 966
 967.imgedit-rleft:before {
 968	content: "\f166";
 969}
 970
 971.imgedit-rright:before {
 972	content: "\f167";
 973}
 974
 975.imgedit-flipv:before {
 976	content: "\f168";
 977}
 978
 979.imgedit-fliph:before {
 980	content: "\f169";
 981}
 982
 983.imgedit-undo:before {
 984	content: "\f171";
 985}
 986
 987.imgedit-redo:before {
 988	content: "\f172";
 989}
 990
 991.imgedit-crop-wrap {
 992	position: relative;
 993}
 994
 995.imgedit-crop-wrap img {
 996	background-image: linear-gradient(-45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(-45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
 997	background-position: 100% 0, 10px 10px;
 998	background-size: 20px 20px;
 999}
1000
1001.imgedit-crop {
1002	margin: 0 0 0 8px;
1003}
1004
1005.imgedit-rleft {
1006	margin: 0 3px;
1007}
1008
1009.imgedit-rright {
1010	margin: 0 3px 0 8px;
1011}
1012
1013.imgedit-flipv {
1014	margin: 0 3px;
1015}
1016
1017.imgedit-fliph {
1018	margin: 0 3px 0 8px;
1019}
1020
1021.imgedit-undo {
1022	margin: 0 3px;
1023}
1024
1025.imgedit-redo {
1026	margin: 0 3px 0 8px;
1027}
1028
1029.imgedit-thumbnail-preview {
1030	margin: 10px 0 0 8px;
1031}
1032
1033.imgedit-thumbnail-preview-caption {
1034	display: block;
1035}
1036
1037#poststuff .imgedit-group-top h3, /* Back-compat for pre-4.4 */
1038#poststuff .imgedit-group-top h2 {
1039	display: inline-block;
1040	margin: 0;
1041	padding: 0;
1042	font-size: 14px;
1043	line-height: 1.4;
1044}
1045
1046#poststuff .imgedit-group-top .button-link {
1047	text-decoration: none;
1048	color: #23282d;
1049}
1050
1051.imgedit-applyto .imgedit-label {
1052	display: block;
1053	padding: .5em 0 0;
1054}
1055
1056.imgedit-help {
1057	display: none;
1058	font-style: italic;
1059}
1060
1061/* higher specificity than buttons */
1062.image-editor .imgedit-settings .imgedit-help-toggle,
1063.image-editor .imgedit-settings .imgedit-help-toggle:hover,
1064.image-editor .imgedit-settings .imgedit-help-toggle:active {
1065	border: 1px solid transparent;
1066	margin: -1px -1px 0 0;
1067	padding: 0;
1068	background: transparent;
1069	color: #0074a2;
1070	font-size: 20px;
1071	line-height: 1;
1072	cursor: pointer;
1073	box-sizing: content-box;
1074	box-shadow: none;
1075}
1076
1077.image-editor .imgedit-settings .imgedit-help-toggle:focus {
1078	color: #0074a2;
1079	border-color: #5b9dd9;
1080	outline: none;
1081	box-shadow: 0 0 3px rgba( 0, 115, 170, .8 );
1082}
1083
1084.form-table td.imgedit-response {
1085	padding: 0;
1086}
1087
1088.imgedit-submit {
1089	margin: 8px 0 0;
1090}
1091
1092.imgedit-submit-btn {
1093	margin-right: 20px;
1094}
1095
1096.imgedit-wrap .nowrap {
1097	white-space: nowrap;
1098	font-size: 12px;
1099	line-height: inherit;
1100}
1101
1102span.imgedit-scale-warn {
1103	color: #dc3232;
1104	font-size: 20px;
1105	font-style: normal;
1106	visibility: hidden;
1107	vertical-align: middle;
1108}
1109
1110.imgedit-save-target {
1111	margin: 8px 0;
1112}
1113
1114.imgedit-group {
1115	margin-bottom: 8px;
1116	padding: 10px;
1117}
1118
1119.imgedit-settings .imgedit-scale input[type="text"],
1120.imgedit-settings .imgedit-crop-ratio input[type="text"],
1121.imgedit-settings .imgedit-crop-sel input[type="text"] {
1122	width: 50px;
1123	font-size: 14px;
1124	padding: 5px 8px;
1125}
1126
1127.imgedit-separator {
1128	display: inline-block;
1129	width: 7px;
1130	text-align: center;
1131	vertical-align: middle;
1132	font-size: 13px;
1133	color: #444;
1134}
1135
1136.imgedit-settings .imgedit-scale .button {
1137	margin-bottom: 0;
1138}
1139
1140audio, video {
1141	display: inline-block;
1142	max-width: 100%;
1143}
1144
1145.mejs-container {
1146	width: 100%;
1147	max-width: 100%;
1148}
1149
1150/* =Media Queries
1151-------------------------------------------------------------- */
1152
1153/**
1154 * HiDPI Displays
1155 */
1156@media print,
1157  (-webkit-min-device-pixel-ratio: 1.25),
1158  (min-resolution: 120dpi) {
1159	.imgedit-wait:before {
1160		background-image: url(../images/spinner-2x.gif);
1161	}
1162}
1163
1164@media screen and ( max-width: 782px ) {
1165	.wp_attachment_details label[for="content"] {
1166		font-size: 14px;
1167		line-height: 1.5em;
1168	}
1169
1170	.media-upload-form .media-item.error,
1171	.media-upload-form .media-item .error {
1172		font-size: 13px;
1173		line-height: 1.5;
1174	}
1175
1176	.media-upload-form .media-item.error {
1177		padding: 1px 10px;
1178	}
1179
1180	.media-upload-form .media-item .error {
1181		padding: 10px 12px 10px 0;
1182	}
1183
1184	.imgedit-settings .imgedit-scale input[type="text"],
1185	.imgedit-settings .imgedit-crop-ratio input[type="text"],
1186	.imgedit-settings .imgedit-crop-sel input[type="text"] {
1187		width: 60px;
1188		font-size: 16px;
1189		padding: 6px 10px;
1190	}
1191
1192	.imgedit-applyto .imgedit-label {
1193		vertical-align: middle;
1194	}
1195}
1196
1197/**
1198 * Media queries for media grid.
1199 */
1200
1201@media only screen and (max-width: 1120px) {
1202	/* override for media-views.css */
1203	#wp-media-grid .wp-filter .attachment-filters {
1204		max-width: 100%;
1205	}
1206}
1207
1208@media only screen and ( max-width: 782px ) {
1209	.media-frame.mode-select .attachments-browser.fixed .media-toolbar {
1210		top: 46px;
1211		left: 10px;
1212	}
1213}
1214
1215@media only screen and (max-width: 600px) {
1216	.media-frame.mode-select .attachments-browser.fixed .media-toolbar {
1217		top: 0;
1218	}
1219}
1220
1221@media only screen and (max-width: 480px) {
1222	.edit-attachment-frame .media-frame-title {
1223		left: 110px;
1224	}
1225
1226	.upload-php .media-modal-close,
1227	.edit-attachment-frame .edit-media-header .left,
1228	.edit-attachment-frame .edit-media-header .right {
1229		width: 40px;
1230		height: 40px;
1231	}
1232
1233	.upload-php .media-modal-close .media-modal-icon {
1234		margin: 9px 10px;
1235	}
1236
1237	.edit-attachment-frame .edit-media-header .right:before,
1238	.edit-attachment-frame .edit-media-header .left:before {
1239		line-height: 40px !important;
1240	}
1241
1242	.edit-attachment-frame .edit-media-header .left {
1243		left: 82px;
1244	}
1245
1246	.edit-attachment-frame .edit-media-header .right {
1247		left: 41px;
1248	}
1249
1250	.edit-attachment-frame .media-frame-content {
1251		top: 40px;
1252	}
1253
1254	.edit-attachment-frame .attachment-media-view {
1255		float: none;
1256		height: auto;
1257		width: 100%;
1258	}
1259
1260	.edit-attachment-frame .attachment-info {
1261		height: auto;
1262		width: 100%;
1263	}
1264}
1265
1266@media only screen and (max-width: 640px), screen and (max-height: 400px) {
1267	.upload-php .mode-grid .media-sidebar{
1268		max-width: 100%;
1269	}
1270}