wp/wp-includes/css/media-views-rtl.css
changeset 18 be944660c56a
parent 16 a86126ab1dd4
child 19 3d72ae0968f4
equal deleted inserted replaced
17:34716fd837a4 18:be944660c56a
    35 	line-height: 1.2;
    35 	line-height: 1.2;
    36 }
    36 }
    37 
    37 
    38 .media-frame a {
    38 .media-frame a {
    39 	border-bottom: none;
    39 	border-bottom: none;
    40 	color: #0073aa;
    40 	color: #2271b1;
    41 }
    41 }
    42 
    42 
    43 .media-frame a:hover,
    43 .media-frame a:hover,
    44 .media-frame a:active {
    44 .media-frame a:active {
    45 	color: #006799;
    45 	color: #135e96;
    46 }
    46 }
    47 
    47 
    48 .media-frame a:focus {
    48 .media-frame a:focus {
    49 	box-shadow:
    49 	box-shadow:
    50 		0 0 0 1px #5b9dd9,
    50 		0 0 0 1px #4f94d4,
    51 		0 0 2px 1px rgba(30, 140, 190, 0.8);
    51 		0 0 2px 1px rgba(79, 148, 212, 0.8);
    52 	color: #124964;
    52 	color: #043959;
    53 	/* Only visible in Windows High Contrast mode */
    53 	/* Only visible in Windows High Contrast mode */
    54 	outline: 1px solid transparent;
    54 	outline: 1px solid transparent;
    55 }
    55 }
    56 
    56 
    57 .media-frame a.button {
    57 .media-frame a.button {
    58 	color: #32373c;
    58 	color: #2c3338;
    59 }
    59 }
    60 
    60 
    61 .media-frame a.button:hover {
    61 .media-frame a.button:hover {
    62 	color: #23282d;
    62 	color: #1d2327;
    63 }
    63 }
    64 
    64 
    65 .media-frame a.button-primary,
    65 .media-frame a.button-primary,
    66 .media-frame a.button-primary:hover {
    66 .media-frame a.button-primary:hover {
    67 	color: #fff;
    67 	color: #fff;
    94 .media-frame input[type="week"],
    94 .media-frame input[type="week"],
    95 .media-frame textarea,
    95 .media-frame textarea,
    96 .media-frame select {
    96 .media-frame select {
    97 	box-shadow: 0 0 0 transparent;
    97 	box-shadow: 0 0 0 transparent;
    98 	border-radius: 4px;
    98 	border-radius: 4px;
    99 	border: 1px solid #7e8993;
    99 	border: 1px solid #8c8f94;
   100 	background-color: #fff;
   100 	background-color: #fff;
   101 	color: #32373c;
   101 	color: #2c3338;
   102 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   102 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   103 	font-size: 13px;
   103 	font-size: 13px;
   104 }
   104 }
   105 
   105 
   106 .media-frame input[type="text"],
   106 .media-frame input[type="text"],
   133 .media-frame input[type="search"]:focus,
   133 .media-frame input[type="search"]:focus,
   134 .media-frame input[type="email"]:focus,
   134 .media-frame input[type="email"]:focus,
   135 .media-frame input[type="url"]:focus,
   135 .media-frame input[type="url"]:focus,
   136 .media-frame textarea:focus,
   136 .media-frame textarea:focus,
   137 .media-frame select:focus {
   137 .media-frame select:focus {
   138 	border-color: #007cba;
   138 	border-color: #3582c4;
   139 	box-shadow: 0 0 0 1px #007cba;
   139 	box-shadow: 0 0 0 1px #3582c4;
   140 	outline: 2px solid transparent;
   140 	outline: 2px solid transparent;
   141 }
   141 }
   142 
   142 
   143 .media-frame input:disabled,
   143 .media-frame input:disabled,
   144 .media-frame textarea:disabled,
   144 .media-frame textarea:disabled,
   145 .media-frame input[readonly],
   145 .media-frame input[readonly],
   146 .media-frame textarea[readonly] {
   146 .media-frame textarea[readonly] {
   147 	background-color: #eee;
   147 	background-color: #f0f0f1;
   148 }
   148 }
   149 
   149 
   150 .media-frame input[type="search"] {
   150 .media-frame input[type="search"] {
   151 	-webkit-appearance: textfield;
   151 	-webkit-appearance: textfield;
   152 }
   152 }
   153 
   153 
   154 .media-frame ::-webkit-input-placeholder {
   154 .media-frame ::-webkit-input-placeholder {
   155 	color: #72777c;
   155 	color: #646970;
   156 }
   156 }
   157 
   157 
   158 .media-frame ::-moz-placeholder {
   158 .media-frame ::-moz-placeholder {
   159 	color: #72777c;
   159 	color: #646970;
   160 	opacity: 1;
   160 	opacity: 1;
   161 }
   161 }
   162 
   162 
   163 .media-frame :-ms-input-placeholder {
   163 .media-frame :-ms-input-placeholder {
   164 	color: #72777c;
   164 	color: #646970;
   165 }
   165 }
   166 
   166 
   167 /*
   167 /*
   168  * In some cases there's the need of higher specificity,
   168  * In some cases there's the need of higher specificity,
   169  * for example higher than `.media-embed .setting`.
   169  * for example higher than `.media-embed .setting`.
   226 	height: 50px;
   226 	height: 50px;
   227 	margin: 0;
   227 	margin: 0;
   228 	padding: 0;
   228 	padding: 0;
   229 	border: 1px solid transparent;
   229 	border: 1px solid transparent;
   230 	background: none;
   230 	background: none;
   231 	color: #666;
   231 	color: #646970;
   232 	z-index: 1000;
   232 	z-index: 1000;
   233 	cursor: pointer;
   233 	cursor: pointer;
   234 	outline: none;
   234 	outline: none;
   235 	transition: color .1s ease-in-out, background .1s ease-in-out;
   235 	transition: color .1s ease-in-out, background .1s ease-in-out;
   236 }
   236 }
   237 
   237 
   238 .media-modal-close:hover,
   238 .media-modal-close:hover,
   239 .media-modal-close:active {
   239 .media-modal-close:active {
   240 	color: #006799;
   240 	color: #135e96;
   241 }
   241 }
   242 
   242 
   243 .media-modal-close:focus {
   243 .media-modal-close:focus {
   244 	color: #006799;
   244 	color: #135e96;
   245 	border-color: #5b9dd9;
   245 	border-color: #4f94d4;
   246 	box-shadow: 0 0 3px rgba(0, 115, 170, 0.8);
   246 	box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
   247 	/* Only visible in Windows High Contrast mode */
   247 	/* Only visible in Windows High Contrast mode */
   248 	outline: 2px solid transparent;
   248 	outline: 2px solid transparent;
   249 }
   249 }
   250 
   250 
   251 .media-modal-close span.media-modal-icon {
   251 .media-modal-close span.media-modal-icon {
   253 }
   253 }
   254 
   254 
   255 .media-modal-close .media-modal-icon:before {
   255 .media-modal-close .media-modal-icon:before {
   256 	content: "\f158";
   256 	content: "\f158";
   257 	font: normal 20px/1 dashicons;
   257 	font: normal 20px/1 dashicons;
   258 	speak: none;
   258 	speak: never;
   259 	vertical-align: middle;
   259 	vertical-align: middle;
   260 	-webkit-font-smoothing: antialiased;
   260 	-webkit-font-smoothing: antialiased;
   261 	-moz-osx-font-smoothing: grayscale;
   261 	-moz-osx-font-smoothing: grayscale;
   262 }
   262 }
   263 
   263 
   268 	left: 0;
   268 	left: 0;
   269 	bottom: 0;
   269 	bottom: 0;
   270 	overflow: auto;
   270 	overflow: auto;
   271 	min-height: 300px;
   271 	min-height: 300px;
   272 	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.7);
   272 	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.7);
   273 	background: #fcfcfc;
   273 	background: #fff;
   274 	-webkit-font-smoothing: subpixel-antialiased;
   274 	-webkit-font-smoothing: subpixel-antialiased;
   275 }
   275 }
   276 
   276 
   277 .media-modal-content .media-frame select.attachment-filters {
   277 .media-modal-content .media-frame select.attachment-filters {
   278 	margin-top: 32px;
   278 	margin-top: 32px;
   300 	right: 0;
   300 	right: 0;
   301 	left: 0;
   301 	left: 0;
   302 	z-index: 100;
   302 	z-index: 100;
   303 	height: 60px;
   303 	height: 60px;
   304 	padding: 0 16px;
   304 	padding: 0 16px;
   305 	border: 0 solid #ddd;
   305 	border: 0 solid #dcdcde;
   306 	overflow: hidden;
   306 	overflow: hidden;
   307 }
   307 }
   308 
   308 
   309 .media-frame-toolbar .media-toolbar {
   309 .media-frame-toolbar .media-toolbar {
   310 	top: auto;
   310 	top: auto;
   311 	bottom: -47px;
   311 	bottom: -47px;
   312 	height: auto;
   312 	height: auto;
   313 	overflow: visible;
   313 	overflow: visible;
   314 	border-top: 1px solid #ddd;
   314 	border-top: 1px solid #dcdcde;
   315 }
   315 }
   316 
   316 
   317 .media-toolbar-primary {
   317 .media-toolbar-primary {
   318 	float: left;
   318 	float: left;
   319 	height: 100%;
   319 	height: 100%;
   347 	left: 0;
   347 	left: 0;
   348 	bottom: 0;
   348 	bottom: 0;
   349 	width: 267px;
   349 	width: 267px;
   350 	padding: 0 16px;
   350 	padding: 0 16px;
   351 	z-index: 75;
   351 	z-index: 75;
   352 	background: #f3f3f3;
   352 	background: #f6f7f7;
   353 	border-right: 1px solid #ddd;
   353 	border-right: 1px solid #dcdcde;
   354 	overflow: auto;
   354 	overflow: auto;
   355 	-webkit-overflow-scrolling: touch;
   355 	-webkit-overflow-scrolling: touch;
   356 }
   356 }
   357 
   357 
   358 /*
   358 /*
   369 .hide-toolbar .media-sidebar {
   369 .hide-toolbar .media-sidebar {
   370 	bottom: 0;
   370 	bottom: 0;
   371 }
   371 }
   372 
   372 
   373 .media-sidebar h2,
   373 .media-sidebar h2,
   374 .image-details h2 {
   374 .image-details h2:not(.media-attachments-filter-heading) {
   375 	position: relative;
   375 	position: relative;
   376 	font-weight: 600;
   376 	font-weight: 600;
   377 	text-transform: uppercase;
   377 	text-transform: uppercase;
   378 	font-size: 12px;
   378 	font-size: 12px;
   379 	color: #666;
   379 	color: #646970;
   380 	margin: 24px 0 8px;
   380 	margin: 24px 0 8px;
   381 }
   381 }
   382 
   382 
   383 .media-sidebar .setting,
   383 .media-sidebar .setting,
   384 .attachment-details .setting {
   384 .attachment-details .setting {
   449 	float: right;
   449 	float: right;
   450 	min-height: 22px;
   450 	min-height: 22px;
   451 	padding-top: 8px;
   451 	padding-top: 8px;
   452 	line-height: 1.33333333;
   452 	line-height: 1.33333333;
   453 	font-weight: 400;
   453 	font-weight: 400;
   454 	color: #666;
   454 	color: #646970;
   455 }
   455 }
   456 
   456 
   457 .media-sidebar .checkbox-label-inline {
   457 .media-sidebar .checkbox-label-inline {
   458 	font-size: 12px;
   458 	font-size: 12px;
   459 }
   459 }
   473 
   473 
   474 .media-sidebar .copy-to-clipboard-container .success,
   474 .media-sidebar .copy-to-clipboard-container .success,
   475 .attachment-details .copy-to-clipboard-container .success {
   475 .attachment-details .copy-to-clipboard-container .success {
   476 	padding: 0;
   476 	padding: 0;
   477 	min-height: 0;
   477 	min-height: 0;
       
   478 	line-height: 2.18181818;
   478 	text-align: right;
   479 	text-align: right;
       
   480 	color: #008a20;
   479 }
   481 }
   480 
   482 
   481 .compat-item label span {
   483 .compat-item label span {
   482 	text-align: left;
   484 	text-align: left;
   483 }
   485 }
   601 	right: 0;
   603 	right: 0;
   602 	left: 0;
   604 	left: 0;
   603 	bottom: 0;
   605 	bottom: 0;
   604 	margin: 0;
   606 	margin: 0;
   605 	padding: 50px 0 10px;
   607 	padding: 50px 0 10px;
   606 	background: #f3f3f3;
   608 	background: #f6f7f7;
   607 	border-left-width: 1px;
   609 	border-left-width: 1px;
   608 	border-left-style: solid;
   610 	border-left-style: solid;
   609 	border-left-color: #ccc;
   611 	border-left-color: #c3c4c7;
   610 	-webkit-user-select: none;
   612 	-webkit-user-select: none;
   611 	-moz-user-select: none;
       
   612 	-ms-user-select: none;
       
   613 	user-select: none;
   613 	user-select: none;
   614 }
   614 }
   615 
   615 
   616 .media-menu .media-menu-item {
   616 .media-menu .media-menu-item {
   617 	display: block;
   617 	display: block;
   622 	margin: 0;
   622 	margin: 0;
   623 	padding: 8px 20px;
   623 	padding: 8px 20px;
   624 	font-size: 14px;
   624 	font-size: 14px;
   625 	line-height: 1.28571428;
   625 	line-height: 1.28571428;
   626 	background: transparent;
   626 	background: transparent;
   627 	color: #0073aa;
   627 	color: #2271b1;
   628 	text-align: right;
   628 	text-align: right;
   629 	text-decoration: none;
   629 	text-decoration: none;
   630 	cursor: pointer;
   630 	cursor: pointer;
   631 }
   631 }
   632 
   632 
   633 .media-menu .media-menu-item:hover {
   633 .media-menu .media-menu-item:hover {
   634 	background: rgba(0, 0, 0, 0.04);
   634 	background: rgba(0, 0, 0, 0.04);
   635 }
   635 }
   636 
   636 
   637 .media-menu .media-menu-item:active {
   637 .media-menu .media-menu-item:active {
   638 	color: #0073aa;
   638 	color: #2271b1;
   639 	outline: none;
   639 	outline: none;
   640 }
   640 }
   641 
   641 
   642 .media-menu .active,
   642 .media-menu .active,
   643 .media-menu .active:hover {
   643 .media-menu .active:hover {
   644 	color: #23282d;
   644 	color: #1d2327;
   645 	font-weight: 600;
   645 	font-weight: 600;
   646 }
   646 }
   647 
   647 
   648 .media-menu .media-menu-item:focus {
   648 .media-menu .media-menu-item:focus {
   649 	box-shadow:
   649 	box-shadow:
   650 		0 0 0 1px #5b9dd9,
   650 		0 0 0 1px #4f94d4,
   651 		0 0 2px 1px rgba(30, 140, 190, 0.8);
   651 		0 0 2px 1px rgba(79, 148, 212, 0.8);
   652 	color: #124964;
   652 	color: #043959;
   653 	/* Only visible in Windows High Contrast mode */
   653 	/* Only visible in Windows High Contrast mode */
   654 	outline: 1px solid transparent;
   654 	outline: 1px solid transparent;
   655 }
   655 }
   656 
   656 
   657 .media-menu .separator {
   657 .media-menu .separator {
   658 	height: 0;
   658 	height: 0;
   659 	margin: 12px 20px;
   659 	margin: 12px 20px;
   660 	padding: 0;
   660 	padding: 0;
   661 	border-top: 1px solid #ddd;
   661 	border-top: 1px solid #dcdcde;
   662 }
   662 }
   663 
   663 
   664 /**
   664 /**
   665  * Menu
   665  * Menu
   666  */
   666  */
   690 	border-left: 0;
   690 	border-left: 0;
   691 }
   691 }
   692 
   692 
   693 .media-router .media-menu-item:hover,
   693 .media-router .media-menu-item:hover,
   694 .media-router .media-menu-item:active {
   694 .media-router .media-menu-item:active {
   695 	color: #0073aa;
   695 	color: #2271b1;
   696 }
   696 }
   697 
   697 
   698 .media-router .active,
   698 .media-router .active,
   699 .media-router .active:hover {
   699 .media-router .active:hover {
   700 	color: #23282d;
   700 	color: #1d2327;
   701 }
   701 }
   702 
   702 
   703 .media-router .media-menu-item:focus {
   703 .media-router .media-menu-item:focus {
   704 	box-shadow:
   704 	box-shadow:
   705 		0 0 0 1px #5b9dd9,
   705 		0 0 0 1px #4f94d4,
   706 		0 0 2px 1px rgba(30, 140, 190, 0.8);
   706 		0 0 2px 1px rgba(79, 148, 212, 0.8);
   707 	color: #124964;
   707 	color: #043959;
   708 	/* Only visible in Windows High Contrast mode */
   708 	/* Only visible in Windows High Contrast mode */
   709 	outline: 1px solid transparent;
   709 	outline: 1px solid transparent;
   710 }
   710 }
   711 
   711 
   712 .media-router .active,
   712 .media-router .active,
   713 .media-router .media-menu-item.active:last-child {
   713 .media-router .media-menu-item.active:last-child {
   714 	margin: -1px -1px 0;
   714 	margin: -1px -1px 0;
   715 	background: #fff;
   715 	background: #fff;
   716 	border: 1px solid #ddd;
   716 	border: 1px solid #dcdcde;
   717 	border-bottom: none;
   717 	border-bottom: none;
   718 }
   718 }
   719 
   719 
   720 .media-router .active:after {
   720 .media-router .active:after {
   721 	display: none;
   721 	display: none;
   769 	height: auto;
   769 	height: auto;
   770 	width: auto;
   770 	width: auto;
   771 	margin: 0;
   771 	margin: 0;
   772 	overflow: auto;
   772 	overflow: auto;
   773 	background: #fff;
   773 	background: #fff;
   774 	border-top: 1px solid #ddd;
   774 	border-top: 1px solid #dcdcde;
   775 }
   775 }
   776 
   776 
   777 .media-frame-toolbar {
   777 .media-frame-toolbar {
   778 	position: absolute;
   778 	position: absolute;
   779 	right: 200px;
   779 	right: 200px;
   908  */
   908  */
   909 .media-frame .search {
   909 .media-frame .search {
   910 	margin: 32px 0 0;
   910 	margin: 32px 0 0;
   911 	padding: 4px;
   911 	padding: 4px;
   912 	font-size: 13px;
   912 	font-size: 13px;
   913 	color: #444;
   913 	color: #3c434a;
   914 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   914 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   915 	-webkit-appearance: none;
   915 	-webkit-appearance: none;
   916 }
   916 }
   917 
   917 
   918 .media-toolbar-primary .search {
   918 .media-toolbar-primary .search {
   941 .wp-core-ui .attachment {
   941 .wp-core-ui .attachment {
   942 	position: relative;
   942 	position: relative;
   943 	float: right;
   943 	float: right;
   944 	padding: 8px;
   944 	padding: 8px;
   945 	margin: 0;
   945 	margin: 0;
   946 	color: #444;
   946 	color: #3c434a;
   947 	cursor: pointer;
   947 	cursor: pointer;
   948 	list-style: none;
   948 	list-style: none;
   949 	text-align: center;
   949 	text-align: center;
   950 	-webkit-user-select: none;
   950 	-webkit-user-select: none;
   951 	-moz-user-select: none;
       
   952 	-ms-user-select: none;
       
   953 	user-select: none;
   951 	user-select: none;
   954 	width: 25%;
   952 	width: 25%;
   955 	box-sizing: border-box;
   953 	box-sizing: border-box;
   956 }
   954 }
   957 
   955 
   958 .wp-core-ui .attachment:focus,
   956 .wp-core-ui .attachment:focus,
   959 .wp-core-ui .selected.attachment:focus,
   957 .wp-core-ui .selected.attachment:focus,
   960 .wp-core-ui .attachment.details:focus {
   958 .wp-core-ui .attachment.details:focus {
   961 	box-shadow:
   959 	box-shadow:
   962 		inset 0 0 2px 3px #fff,
   960 		inset 0 0 2px 3px #fff,
   963 		inset 0 0 0 7px #5b9dd9;
   961 		inset 0 0 0 7px #4f94d4;
   964 	/* Only visible in Windows High Contrast mode */
   962 	/* Only visible in Windows High Contrast mode */
   965 	outline: 2px solid transparent;
   963 	outline: 2px solid transparent;
   966 	outline-offset: -6px;
   964 	outline-offset: -6px;
   967 }
   965 }
   968 
   966 
   969 .wp-core-ui .selected.attachment {
   967 .wp-core-ui .selected.attachment {
   970 	box-shadow:
   968 	box-shadow:
   971 		inset 0 0 0 5px #fff,
   969 		inset 0 0 0 5px #fff,
   972 		inset 0 0 0 7px #ccc;
   970 		inset 0 0 0 7px #c3c4c7;
   973 }
   971 }
   974 
   972 
   975 .wp-core-ui .attachment.details {
   973 .wp-core-ui .attachment.details {
   976 	box-shadow:
   974 	box-shadow:
   977 		inset 0 0 0 3px #fff,
   975 		inset 0 0 0 3px #fff,
   978 		inset 0 0 0 7px #0073aa;
   976 		inset 0 0 0 7px #2271b1;
   979 }
   977 }
   980 
   978 
   981 .wp-core-ui .attachment-preview {
   979 .wp-core-ui .attachment-preview {
   982 	position: relative;
   980 	position: relative;
   983 	box-shadow:
   981 	box-shadow:
   984 		inset 0 0 15px rgba(0, 0, 0, 0.1),
   982 		inset 0 0 15px rgba(0, 0, 0, 0.1),
   985 		inset 0 0 0 1px rgba(0, 0, 0, 0.05);
   983 		inset 0 0 0 1px rgba(0, 0, 0, 0.05);
   986 	background: #eee;
   984 	background: #f0f0f1;
   987 	cursor: pointer;
   985 	cursor: pointer;
   988 }
   986 }
   989 
   987 
   990 .wp-core-ui .attachment-preview:before {
   988 .wp-core-ui .attachment-preview:before {
   991 	content: "";
   989 	content: "";
  1102 	position: absolute;
  1100 	position: absolute;
  1103 	z-index: 10;
  1101 	z-index: 10;
  1104 	top: 0;
  1102 	top: 0;
  1105 	left: 0;
  1103 	left: 0;
  1106 	outline: none;
  1104 	outline: none;
  1107 	background: #eee;
  1105 	background: #f0f0f1;
  1108 	cursor: pointer;
  1106 	cursor: pointer;
  1109 	box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 0, 0, 0.15);
  1107 	box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 0, 0, 0.15);
  1110 }
  1108 }
  1111 
  1109 
  1112 .wp-core-ui .attachment .check .media-modal-icon {
  1110 .wp-core-ui .attachment .check .media-modal-icon {
  1126 }
  1124 }
  1127 
  1125 
  1128 .wp-core-ui .attachment.details .check,
  1126 .wp-core-ui .attachment.details .check,
  1129 .wp-core-ui .attachment.selected .check:focus,
  1127 .wp-core-ui .attachment.selected .check:focus,
  1130 .wp-core-ui .media-frame.mode-grid .attachment.selected .check {
  1128 .wp-core-ui .media-frame.mode-grid .attachment.selected .check {
  1131 	background-color: #0073aa;
  1129 	background-color: #2271b1;
  1132 	box-shadow:
  1130 	box-shadow:
  1133 		0 0 0 1px #fff,
  1131 		0 0 0 1px #fff,
  1134 		0 0 0 2px #0073aa;
  1132 		0 0 0 2px #2271b1;
  1135 }
  1133 }
  1136 
  1134 
  1137 .wp-core-ui .attachment.selected .check:focus {
  1135 .wp-core-ui .attachment.selected .check:focus {
  1138 	/* Only visible in Windows High Contrast mode */
  1136 	/* Only visible in Windows High Contrast mode */
  1139 	outline: 2px solid transparent;
  1137 	outline: 2px solid transparent;
  1189 
  1187 
  1190 .attachments-browser .attachments {
  1188 .attachments-browser .attachments {
  1191 	padding: 2px 8px 8px;
  1189 	padding: 2px 8px 8px;
  1192 }
  1190 }
  1193 
  1191 
  1194 .attachments-browser .attachments,
  1192 .attachments-browser:not(.has-load-more) .attachments,
       
  1193 .attachments-browser.has-load-more .attachments-wrapper,
  1195 .attachments-browser .uploader-inline {
  1194 .attachments-browser .uploader-inline {
  1196 	position: absolute;
  1195 	position: absolute;
  1197 	top: 72px;
  1196 	top: 72px;
  1198 	right: 0;
  1197 	right: 0;
  1199 	left: 300px;
  1198 	left: 300px;
  1238 	z-index: 1;
  1237 	z-index: 1;
  1239 }
  1238 }
  1240 
  1239 
  1241 .uploader-inline .close:before {
  1240 .uploader-inline .close:before {
  1242 	font: normal 30px/1 dashicons !important;
  1241 	font: normal 30px/1 dashicons !important;
  1243 	color: #555d66;
  1242 	color: #50575e;
  1244 	display: inline-block;
  1243 	display: inline-block;
  1245 	content: "\f335";
  1244 	content: "\f335";
  1246 	font-weight: 300;
  1245 	font-weight: 300;
  1247 	margin-top: 1px;
  1246 	margin-top: 1px;
  1248 }
  1247 }
  1249 
  1248 
  1250 .uploader-inline .close:focus {
  1249 .uploader-inline .close:focus {
  1251 	outline: 1px solid #5b9dd9;
  1250 	outline: 1px solid #4f94d4;
  1252 	box-shadow: 0 0 3px rgba(0, 115, 170, 0.8);
  1251 	box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
  1253 }
  1252 }
  1254 
  1253 
  1255 .attachments-browser.hide-sidebar .attachments,
  1254 .attachments-browser.hide-sidebar .attachments,
  1256 .attachments-browser.hide-sidebar .uploader-inline {
  1255 .attachments-browser.hide-sidebar .uploader-inline {
  1257 	left: 0;
  1256 	left: 0;
  1261 .attachments-browser .instructions {
  1260 .attachments-browser .instructions {
  1262 	display: inline-block;
  1261 	display: inline-block;
  1263 	margin-top: 16px;
  1262 	margin-top: 16px;
  1264 	line-height: 1.38461538;
  1263 	line-height: 1.38461538;
  1265 	font-size: 13px;
  1264 	font-size: 13px;
  1266 	color: #666;
  1265 	color: #646970;
  1267 }
  1266 }
  1268 
  1267 
  1269 .attachments-browser .no-media {
  1268 .attachments-browser .no-media {
  1270 	padding: 2em 2em 0 0;
  1269 	padding: 2em 2em 0 0;
       
  1270 }
       
  1271 
       
  1272 .more-loaded .attachment:not(.found-media) {
       
  1273 	background: #dcdcde;
       
  1274 }
       
  1275 
       
  1276 .load-more-wrapper {
       
  1277 	clear: both;
       
  1278 	display: flex;
       
  1279 	flex-wrap: wrap;
       
  1280 	align-items: center;
       
  1281 	justify-content: center;
       
  1282 	padding: 1em 0;
       
  1283 }
       
  1284 
       
  1285 .load-more-wrapper .load-more-count {
       
  1286 	min-width: 100%;
       
  1287 	margin: 0 0 1em;
       
  1288 	text-align: center;
       
  1289 }
       
  1290 
       
  1291 .load-more-wrapper .load-more {
       
  1292 	margin: 0;
       
  1293 }
       
  1294 
       
  1295 /* Needs high specificity. */
       
  1296 .media-frame .load-more-wrapper .load-more + .spinner {
       
  1297 	float: none;
       
  1298 	margin: 0 10px 0 -30px;
       
  1299 }
       
  1300 
       
  1301 /* Reset spinner margin when the button is hidden to avoid horizontal scrollbar. */
       
  1302 .media-frame .load-more-wrapper .load-more.hidden + .spinner {
       
  1303 	margin: 0;
       
  1304 }
       
  1305 
       
  1306 /* Force a new row within the flex container. */
       
  1307 .load-more-wrapper::after {
       
  1308 	content: "";
       
  1309 	min-width: 100%;
       
  1310 	order: 1;
       
  1311 }
       
  1312 
       
  1313 .load-more-wrapper .load-more-jump {
       
  1314 	margin: 0 12px 0 0;
       
  1315 }
       
  1316 
       
  1317 .attachment.new-media {
       
  1318 	outline: 2px dotted #c3c4c7;
       
  1319 }
       
  1320 
       
  1321 .load-more-wrapper {
       
  1322 	clear: both;
       
  1323 	display: flex;
       
  1324 	flex-wrap: wrap;
       
  1325 	align-items: center;
       
  1326 	justify-content: center;
       
  1327 	padding: 1em 0;
       
  1328 }
       
  1329 
       
  1330 .load-more-wrapper .load-more-count {
       
  1331 	min-width: 100%;
       
  1332 	margin: 0 0 1em;
       
  1333 	text-align: center;
       
  1334 }
       
  1335 
       
  1336 .load-more-wrapper .load-more {
       
  1337 	margin: 0;
       
  1338 }
       
  1339 
       
  1340 /* Needs high specificity. */
       
  1341 .media-frame .load-more-wrapper .load-more + .spinner {
       
  1342 	float: none;
       
  1343 	margin: 0 10px 0 -30px;
       
  1344 }
       
  1345 
       
  1346 /* Reset spinner margin when the button is hidden to avoid horizontal scrollbar. */
       
  1347 .media-frame .load-more-wrapper .load-more.hidden + .spinner {
       
  1348 	margin: 0;
       
  1349 }
       
  1350 
       
  1351 /* Force a new row within the flex container. */
       
  1352 .load-more-wrapper::after {
       
  1353 	content: "";
       
  1354 	min-width: 100%;
       
  1355 	order: 1;
       
  1356 }
       
  1357 
       
  1358 .load-more-wrapper .load-more-jump {
       
  1359 	margin: 0 12px 0 0;
  1271 }
  1360 }
  1272 
  1361 
  1273 /**
  1362 /**
  1274  * Progress Bar
  1363  * Progress Bar
  1275  */
  1364  */
  1277 	position: relative;
  1366 	position: relative;
  1278 	height: 10px;
  1367 	height: 10px;
  1279 	width: 70%;
  1368 	width: 70%;
  1280 	margin: 10px auto;
  1369 	margin: 10px auto;
  1281 	border-radius: 10px;
  1370 	border-radius: 10px;
  1282 	background: #ddd;
  1371 	background: #dcdcde;
  1283 	background: rgba(0, 0, 0, 0.1);
  1372 	background: rgba(0, 0, 0, 0.1);
  1284 }
  1373 }
  1285 
  1374 
  1286 .media-progress-bar div {
  1375 .media-progress-bar div {
  1287 	height: 10px;
  1376 	height: 10px;
  1288 	min-width: 20px;
  1377 	min-width: 20px;
  1289 	width: 0;
  1378 	width: 0;
  1290 	background: #0073aa;
  1379 	background: #2271b1;
  1291 	border-radius: 10px;
  1380 	border-radius: 10px;
  1292 	transition: width 300ms;
  1381 	transition: width 300ms;
  1293 }
  1382 }
  1294 
  1383 
  1295 .media-uploader-status .media-progress-bar {
  1384 .media-uploader-status .media-progress-bar {
  1321 }
  1410 }
  1322 
  1411 
  1323 .media-uploader-status .upload-details {
  1412 .media-uploader-status .upload-details {
  1324 	display: none;
  1413 	display: none;
  1325 	font-size: 12px;
  1414 	font-size: 12px;
  1326 	color: #666;
  1415 	color: #646970;
  1327 }
  1416 }
  1328 
  1417 
  1329 .uploading.media-uploader-status .upload-details {
  1418 .uploading.media-uploader-status .upload-details {
  1330 	display: block;
  1419 	display: block;
  1331 }
  1420 }
  1333 .media-uploader-status .upload-detail-separator {
  1422 .media-uploader-status .upload-detail-separator {
  1334 	padding: 0 4px;
  1423 	padding: 0 4px;
  1335 }
  1424 }
  1336 
  1425 
  1337 .media-uploader-status .upload-count {
  1426 .media-uploader-status .upload-count {
  1338 	color: #444;
  1427 	color: #3c434a;
  1339 }
  1428 }
  1340 
  1429 
  1341 .media-uploader-status .upload-dismiss-errors,
  1430 .media-uploader-status .upload-dismiss-errors,
  1342 .media-uploader-status .upload-errors {
  1431 .media-uploader-status .upload-errors {
  1343 	display: none;
  1432 	display: none;
  1365 
  1454 
  1366 .media-uploader-status .upload-dismiss-errors::before {
  1455 .media-uploader-status .upload-dismiss-errors::before {
  1367 	content: "\f153";
  1456 	content: "\f153";
  1368 	display: block;
  1457 	display: block;
  1369 	font: normal 16px/1 dashicons;
  1458 	font: normal 16px/1 dashicons;
  1370 	color: #72777c;
  1459 	color: #787c82;
  1371 }
  1460 }
  1372 
  1461 
  1373 .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before {
  1462 .uploader-inline .errors.media-uploader-status .upload-dismiss-errors::before {
  1374 	color: #606a73;
  1463 	color: #646970;
  1375 }
  1464 }
  1376 
  1465 
  1377 .errors.media-uploader-status .upload-dismiss-errors:hover::before,
  1466 .errors.media-uploader-status .upload-dismiss-errors:hover::before,
  1378 .errors.media-uploader-status .upload-dismiss-errors:focus::before {
  1467 .errors.media-uploader-status .upload-dismiss-errors:focus::before {
  1379 	color: #c00;
  1468 	color: #d63638;
  1380 }
  1469 }
  1381 
  1470 
  1382 .upload-errors .upload-error {
  1471 .upload-errors .upload-error {
  1383 	padding: 12px;
  1472 	padding: 12px;
  1384 	margin-bottom: 12px;
  1473 	margin-bottom: 12px;
  1385 	background: #fff;
  1474 	background: #fff;
  1386 	border-right: 4px solid #dc3232;
  1475 	border-right: 4px solid #d63638;
  1387 	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
  1476 	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
  1388 }
  1477 }
  1389 
  1478 
  1390 .uploader-inline .upload-errors .upload-error {
  1479 .uploader-inline .upload-errors .upload-error {
  1391 	padding: 12px 30px;
  1480 	padding: 12px 30px;
  1392 	background-color: #fbeaea;
  1481 	background-color: #fcf0f1;
  1393 	box-shadow: none;
  1482 	box-shadow: none;
  1394 }
  1483 }
  1395 
  1484 
  1396 .upload-errors .upload-error-filename {
  1485 .upload-errors .upload-error-filename {
  1397 	font-weight: 600;
  1486 	font-weight: 600;
  1424 }
  1513 }
  1425 
  1514 
  1426 .wp-editor-wrap .uploader-editor {
  1515 .wp-editor-wrap .uploader-editor {
  1427 	position: absolute;
  1516 	position: absolute;
  1428 	z-index: 99998; /* under the toolbar */
  1517 	z-index: 99998; /* under the toolbar */
  1429 	background: rgba(150, 150, 150, 0.9);
  1518 	background: rgba(140, 143, 148, 0.9);
  1430 }
  1519 }
  1431 
  1520 
  1432 .uploader-window,
  1521 .uploader-window,
  1433 .wp-editor-wrap .uploader-editor.droppable {
  1522 .wp-editor-wrap .uploader-editor.droppable {
  1434 	background: rgba(0, 86, 132, 0.9);
  1523 	background: rgba(10, 75, 120, 0.9);
  1435 }
  1524 }
  1436 
  1525 
  1437 .uploader-window-content,
  1526 .uploader-window-content,
  1438 .wp-editor-wrap .uploader-editor-content {
  1527 .wp-editor-wrap .uploader-editor-content {
  1439 	position: absolute;
  1528 	position: absolute;
  1517 	margin: 0;
  1606 	margin: 0;
  1518 }
  1607 }
  1519 
  1608 
  1520 .uploader-inline .has-upload-message .upload-instructions {
  1609 .uploader-inline .has-upload-message .upload-instructions {
  1521 	font-size: 14px;
  1610 	font-size: 14px;
  1522 	color: #444;
  1611 	color: #3c434a;
  1523 	font-weight: 400;
  1612 	font-weight: 400;
  1524 }
  1613 }
  1525 
  1614 
  1526 .uploader-inline .drop-instructions {
  1615 .uploader-inline .drop-instructions {
  1527 	display: none;
  1616 	display: none;
  1589 .media-selection .button-link {
  1678 .media-selection .button-link {
  1590 	float: right;
  1679 	float: right;
  1591 	padding: 1px 8px;
  1680 	padding: 1px 8px;
  1592 	margin: 1px -8px 1px 8px;
  1681 	margin: 1px -8px 1px 8px;
  1593 	line-height: 1.4;
  1682 	line-height: 1.4;
  1594 	border-left: 1px solid #ddd;
  1683 	border-left: 1px solid #dcdcde;
  1595 	color: #0073aa;
  1684 	color: #2271b1;
  1596 	text-decoration: none;
  1685 	text-decoration: none;
  1597 }
  1686 }
  1598 
  1687 
  1599 .media-selection .button-link:hover,
  1688 .media-selection .button-link:hover,
  1600 .media-selection .button-link:focus {
  1689 .media-selection .button-link:focus {
  1601 	color: #006799;
  1690 	color: #135e96;
  1602 }
  1691 }
  1603 
  1692 
  1604 .media-selection .button-link:last-child {
  1693 .media-selection .button-link:last-child {
  1605 	border-left: 0;
  1694 	border-left: 0;
  1606 	margin-left: 0;
  1695 	margin-left: 0;
  1607 }
  1696 }
  1608 
  1697 
  1609 .selection-info .clear-selection {
  1698 .selection-info .clear-selection {
  1610 	color: #bc0b0b;
  1699 	color: #d63638;
  1611 }
  1700 }
  1612 
  1701 
  1613 .selection-info .clear-selection:hover,
  1702 .selection-info .clear-selection:hover,
  1614 .selection-info .clear-selection:focus {
  1703 .selection-info .clear-selection:focus {
  1615 	color: #dc3232;
  1704 	color: #d63638;
  1616 }
  1705 }
  1617 
  1706 
  1618 .media-selection .selection-view {
  1707 .media-selection .selection-view {
  1619 	display: inline-block;
  1708 	display: inline-block;
  1620 	vertical-align: top;
  1709 	vertical-align: top;
  1654 .wp-core-ui .media-selection .attachment:focus,
  1743 .wp-core-ui .media-selection .attachment:focus,
  1655 .wp-core-ui .media-selection .selected.attachment:focus,
  1744 .wp-core-ui .media-selection .selected.attachment:focus,
  1656 .wp-core-ui .media-selection .attachment.details:focus {
  1745 .wp-core-ui .media-selection .attachment.details:focus {
  1657 	box-shadow:
  1746 	box-shadow:
  1658 		0 0 0 1px #fff,
  1747 		0 0 0 1px #fff,
  1659 		0 0 2px 3px #5b9dd9;
  1748 		0 0 2px 3px #4f94d4;
  1660 	/* Only visible in Windows High Contrast mode */
  1749 	/* Only visible in Windows High Contrast mode */
  1661 	outline: 2px solid transparent;
  1750 	outline: 2px solid transparent;
  1662 }
  1751 }
  1663 
  1752 
  1664 .wp-core-ui .media-selection .selected.attachment {
  1753 .wp-core-ui .media-selection .selected.attachment {
  1666 }
  1755 }
  1667 
  1756 
  1668 .wp-core-ui .media-selection .attachment.details {
  1757 .wp-core-ui .media-selection .attachment.details {
  1669 	box-shadow:
  1758 	box-shadow:
  1670 		0 0 0 1px #fff,
  1759 		0 0 0 1px #fff,
  1671 		0 0 0 3px #0073aa;
  1760 		0 0 0 3px #2271b1;
  1672 }
  1761 }
  1673 
  1762 
  1674 .media-selection:after {
  1763 .media-selection:after {
  1675 	content: "";
  1764 	content: "";
  1676 	display: block;
  1765 	display: block;
  1677 	position: absolute;
  1766 	position: absolute;
  1678 	top: 0;
  1767 	top: 0;
  1679 	left: 0;
  1768 	left: 0;
  1680 	bottom: 0;
  1769 	bottom: 0;
  1681 	width: 25px;
  1770 	width: 25px;
  1682 	background-image: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  1771 	background-image: linear-gradient(to right,#fff,rgba(255, 255, 255, 0));
  1683 }
  1772 }
  1684 
  1773 
  1685 .media-selection .attachment .filename {
  1774 .media-selection .attachment .filename {
  1686 	display: none;
  1775 	display: none;
  1687 }
  1776 }
  1757 .attachment-info {
  1846 .attachment-info {
  1758 	overflow: hidden;
  1847 	overflow: hidden;
  1759 	min-height: 60px;
  1848 	min-height: 60px;
  1760 	margin-bottom: 16px;
  1849 	margin-bottom: 16px;
  1761 	line-height: 1.5;
  1850 	line-height: 1.5;
  1762 	color: #666;
  1851 	color: #646970;
  1763 	border-bottom: 1px solid #ddd;
  1852 	border-bottom: 1px solid #dcdcde;
  1764 	padding-bottom: 11px;
  1853 	padding-bottom: 11px;
       
  1854 }
       
  1855 
       
  1856 .attachment-info .wp-media-wrapper {
       
  1857 	margin-bottom: 8px;
       
  1858 }
       
  1859 
       
  1860 .attachment-info .wp-media-wrapper.wp-audio {
       
  1861 	margin-top: 13px;
  1765 }
  1862 }
  1766 
  1863 
  1767 .attachment-info .filename {
  1864 .attachment-info .filename {
  1768 	font-weight: 600;
  1865 	font-weight: 600;
  1769 	color: #444;
  1866 	color: #3c434a;
  1770 	word-wrap: break-word;
  1867 	word-wrap: break-word;
  1771 }
  1868 }
  1772 
  1869 
  1773 .attachment-info .thumbnail {
  1870 .attachment-info .thumbnail {
  1774 	position: relative;
  1871 	position: relative;
  1835 .media-modal .delete-attachment,
  1932 .media-modal .delete-attachment,
  1836 .media-modal .trash-attachment,
  1933 .media-modal .trash-attachment,
  1837 .media-modal .untrash-attachment {
  1934 .media-modal .untrash-attachment {
  1838 	display: inline;
  1935 	display: inline;
  1839 	padding: 0;
  1936 	padding: 0;
  1840 	color: #bc0b0b;
  1937 	color: #d63638;
  1841 }
  1938 }
  1842 
  1939 
  1843 .media-modal .delete-attachment:hover,
  1940 .media-modal .delete-attachment:hover,
  1844 .media-modal .delete-attachment:focus,
  1941 .media-modal .delete-attachment:focus,
  1845 .media-modal .trash-attachment:hover,
  1942 .media-modal .trash-attachment:hover,
  1846 .media-modal .trash-attachment:focus,
  1943 .media-modal .trash-attachment:focus,
  1847 .media-modal .untrash-attachment:hover,
  1944 .media-modal .untrash-attachment:hover,
  1848 .media-modal .untrash-attachment:focus {
  1945 .media-modal .untrash-attachment:focus {
  1849 	color: #dc3232;
  1946 	color: #d63638;
  1850 }
  1947 }
  1851 
  1948 
  1852 /**
  1949 /**
  1853  * Attachment Display Settings
  1950  * Attachment Display Settings
  1854  */
  1951  */
  1896 .media-modal .imgedit-wrap .imgedit-submit {
  1993 .media-modal .imgedit-wrap .imgedit-submit {
  1897 	margin-bottom: 16px;
  1994 	margin-bottom: 16px;
  1898 }
  1995 }
  1899 
  1996 
  1900 .media-modal .imgedit-wrap .imgedit-settings {
  1997 .media-modal .imgedit-wrap .imgedit-settings {
  1901 	background: #f3f3f3;
  1998 	background: #f6f7f7;
  1902 	border-right: 1px solid #ddd;
  1999 	border-right: 1px solid #dcdcde;
  1903 	padding: 20px 16px 0;
  2000 	padding: 20px 16px 0;
  1904 	position: absolute;
  2001 	position: absolute;
  1905 	top: 0;
  2002 	top: 0;
  1906 	left: 0;
  2003 	left: 0;
  1907 	bottom: 0;
  2004 	bottom: 0;
  1918 }
  2015 }
  1919 
  2016 
  1920 .media-modal .imgedit-group {
  2017 .media-modal .imgedit-group {
  1921 	background: none;
  2018 	background: none;
  1922 	border: none;
  2019 	border: none;
  1923 	border-bottom: 1px solid #ddd;
  2020 	border-bottom: 1px solid #dcdcde;
  1924 	box-shadow: none;
  2021 	box-shadow: none;
  1925 	margin: 0;
  2022 	margin: 0;
  1926 	margin-bottom: 16px;
  2023 	margin-bottom: 16px;
  1927 	padding: 0;
  2024 	padding: 0;
  1928 	padding-bottom: 16px;
  2025 	padding-bottom: 16px;
  1942 .media-modal .imgedit-group-top h2,
  2039 .media-modal .imgedit-group-top h2,
  1943 .media-modal .imgedit-group-top h2 .button-link {
  2040 .media-modal .imgedit-group-top h2 .button-link {
  1944 	display: inline-block;
  2041 	display: inline-block;
  1945 	text-transform: uppercase;
  2042 	text-transform: uppercase;
  1946 	font-size: 12px;
  2043 	font-size: 12px;
  1947 	color: #666;
  2044 	color: #646970;
  1948 	margin: 0;
  2045 	margin: 0;
  1949 	margin-top: 3px;
  2046 	margin-top: 3px;
  1950 }
  2047 }
  1951 
  2048 
  1952 .media-modal .imgedit-group-top h2 a,
  2049 .media-modal .imgedit-group-top h2 a,
  1953 .media-modal .imgedit-group-top h2 .button-link {
  2050 .media-modal .imgedit-group-top h2 .button-link {
  1954 	text-decoration: none;
  2051 	text-decoration: none;
  1955 	color: #666;
  2052 	color: #646970;
  1956 }
  2053 }
  1957 
  2054 
  1958 /* higher specificity than media.css */
  2055 /* higher specificity than media.css */
  1959 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle,
  2056 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle,
  1960 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:hover,
  2057 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:hover,
  1961 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:active {
  2058 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:active {
  1962 	border: 1px solid transparent;
  2059 	border: 1px solid transparent;
  1963 	margin: 0;
  2060 	margin: 0;
  1964 	padding: 0;
  2061 	padding: 0;
  1965 	background: transparent;
  2062 	background: transparent;
  1966 	color: #0074a2;
  2063 	color: #2271b1;
  1967 	font-size: 20px;
  2064 	font-size: 20px;
  1968 	line-height: 1;
  2065 	line-height: 1;
  1969 	cursor: pointer;
  2066 	cursor: pointer;
  1970 	box-sizing: content-box;
  2067 	box-sizing: content-box;
  1971 	box-shadow: none;
  2068 	box-shadow: none;
  1972 }
  2069 }
  1973 
  2070 
  1974 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus {
  2071 .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus {
  1975 	color: #0074a2;
  2072 	color: #2271b1;
  1976 	border-color: #5b9dd9;
  2073 	border-color: #4f94d4;
  1977 	box-shadow: 0 0 3px rgba(0, 115, 170, 0.8);
  2074 	box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
  1978 	/* Only visible in Windows High Contrast mode */
  2075 	/* Only visible in Windows High Contrast mode */
  1979 	outline: 2px solid transparent;
  2076 	outline: 2px solid transparent;
  1980 }
  2077 }
  1981 
  2078 
  1982 .wp-core-ui.media-modal .imgedit-group-top .dashicons-arrow-down.imgedit-help-toggle {
  2079 .wp-core-ui.media-modal .imgedit-group-top .dashicons-arrow-down.imgedit-help-toggle {
  2085 	display: block;
  2182 	display: block;
  2086 	height: auto;
  2183 	height: auto;
  2087 }
  2184 }
  2088 
  2185 
  2089 .mejs-container:focus {
  2186 .mejs-container:focus {
  2090 	outline: 1px solid #5b9dd9;
  2187 	outline: 1px solid #4f94d4;
  2091 	box-shadow: 0 0 2px 1px rgba(30, 140, 190, 0.8);
  2188 	box-shadow: 0 0 2px 1px rgba(79, 148, 212, 0.8);
  2092 }
  2189 }
  2093 
  2190 
  2094 .image-details .media-modal {
  2191 .image-details .media-modal {
  2095 	right: 140px;
  2192 	right: 140px;
  2096 	left: 140px;
  2193 	left: 140px;
  2116 .image-details .embed-media-settings div {
  2213 .image-details .embed-media-settings div {
  2117 	box-sizing: border-box;
  2214 	box-sizing: border-box;
  2118 }
  2215 }
  2119 
  2216 
  2120 .image-details .column-settings {
  2217 .image-details .column-settings {
  2121 	background: #f3f3f3;
  2218 	background: #f6f7f7;
  2122 	border-left: 1px solid #ddd;
  2219 	border-left: 1px solid #dcdcde;
  2123 	min-height: 100%;
  2220 	min-height: 100%;
  2124 	width: 55%;
  2221 	width: 55%;
  2125 	position: absolute;
  2222 	position: absolute;
  2126 	top: 0;
  2223 	top: 0;
  2127 	right: 0;
  2224 	right: 0;
  2128 }
  2225 }
  2129 
  2226 
  2130 .image-details .column-settings h2 {
  2227 .image-details .column-settings h2 {
  2131 	margin: 20px;
  2228 	margin: 20px;
  2132 	padding-top: 20px;
  2229 	padding-top: 20px;
  2133 	border-top: 1px solid #ddd;
  2230 	border-top: 1px solid #dcdcde;
  2134 	color: #23282d;
  2231 	color: #1d2327;
  2135 }
  2232 }
  2136 
  2233 
  2137 .image-details .column-image {
  2234 .image-details .column-image {
  2138 	width: 45%;
  2235 	width: 45%;
  2139 	position: absolute;
  2236 	position: absolute;
  2150 	max-height: 500px;
  2247 	max-height: 500px;
  2151 }
  2248 }
  2152 
  2249 
  2153 .image-details .advanced-toggle {
  2250 .image-details .advanced-toggle {
  2154 	padding: 0;
  2251 	padding: 0;
  2155 	color: #666;
  2252 	color: #646970;
  2156 	text-transform: uppercase;
  2253 	text-transform: uppercase;
  2157 	text-decoration: none;
  2254 	text-decoration: none;
  2158 }
  2255 }
  2159 
  2256 
  2160 .image-details .advanced-toggle:hover,
  2257 .image-details .advanced-toggle:hover,
  2161 .image-details .advanced-toggle:active {
  2258 .image-details .advanced-toggle:active {
  2162 	color: #666;
  2259 	color: #646970;
  2163 }
  2260 }
  2164 
  2261 
  2165 .image-details .advanced-toggle:after {
  2262 .image-details .advanced-toggle:after {
  2166 	font: normal 20px/1 dashicons;
  2263 	font: normal 20px/1 dashicons;
  2167 	speak: none;
  2264 	speak: never;
  2168 	vertical-align: top;
  2265 	vertical-align: top;
  2169 	-webkit-font-smoothing: antialiased;
  2266 	-webkit-font-smoothing: antialiased;
  2170 	-moz-osx-font-smoothing: grayscale;
  2267 	-moz-osx-font-smoothing: grayscale;
  2171 	content: "\f140";
  2268 	content: "\f140";
  2172 	display: inline-block;
  2269 	display: inline-block;
  2317 .media-embed .setting .name,
  2414 .media-embed .setting .name,
  2318 .media-embed .setting-group .name {
  2415 .media-embed .setting-group .name {
  2319 	display: inline-block;
  2416 	display: inline-block;
  2320 	font-size: 13px;
  2417 	font-size: 13px;
  2321 	line-height: 1.84615384;
  2418 	line-height: 1.84615384;
  2322 	color: #666;
  2419 	color: #646970;
  2323 }
  2420 }
  2324 
  2421 
  2325 .media-embed .setting span {
  2422 .media-embed .setting span {
  2326 	display: block; /* Back-compat for pre-5.3 */
  2423 	display: block; /* Back-compat for pre-5.3 */
  2327 	width: 200px; /* Back-compat for pre-5.3 */
  2424 	width: 200px; /* Back-compat for pre-5.3 */
  2454 		right: 50%;
  2551 		right: 50%;
  2455 		transform: translateX(50%);
  2552 		transform: translateX(50%);
  2456 		left: auto;
  2553 		left: auto;
  2457 		bottom: auto;
  2554 		bottom: auto;
  2458 		padding: 5px 0;
  2555 		padding: 5px 0;
  2459 		border: 1px solid #ccc;
  2556 		border: 1px solid #c3c4c7;
  2460 	}
  2557 	}
  2461 
  2558 
  2462 	.media-frame:not(.hide-menu) .media-menu.visible {
  2559 	.media-frame:not(.hide-menu) .media-menu.visible {
  2463 		display: block;
  2560 		display: block;
  2464 	}
  2561 	}
  2519 		width: 230px;
  2616 		width: 230px;
  2520 	}
  2617 	}
  2521 
  2618 
  2522 	.attachments-browser .attachments,
  2619 	.attachments-browser .attachments,
  2523 	.attachments-browser .uploader-inline,
  2620 	.attachments-browser .uploader-inline,
  2524 	.attachments-browser .media-toolbar {
  2621 	.attachments-browser .media-toolbar,
       
  2622 	.attachments-browser .attachments-wrapper,
       
  2623 	.attachments-browser.has-load-more .attachments-wrapper {
  2525 		left: 262px;
  2624 		left: 262px;
  2526 	}
  2625 	}
  2527 
  2626 
  2528 	.media-sidebar .setting,
  2627 	.media-sidebar .setting,
  2529 	.attachment-details .setting {
  2628 	.attachment-details .setting {
  2786 		bottom: 0;
  2885 		bottom: 0;
  2787 	}
  2886 	}
  2788 
  2887 
  2789 	.attachments-browser .attachments,
  2888 	.attachments-browser .attachments,
  2790 	.attachments-browser .uploader-inline,
  2889 	.attachments-browser .uploader-inline,
  2791 	.attachments-browser .media-toolbar {
  2890 	.attachments-browser .media-toolbar,
       
  2891 	.media-frame-content .attachments-browser .attachments-wrapper {
  2792 		left: 0;
  2892 		left: 0;
       
  2893 	}
       
  2894 
       
  2895 	.attachments-browser .attachments-wrapper {
       
  2896 		padding-top: 12px;
  2793 	}
  2897 	}
  2794 
  2898 
  2795 	.image-details .media-frame-title {
  2899 	.image-details .media-frame-title {
  2796 		display: block;
  2900 		display: block;
  2797 		top: 0;
  2901 		top: 0;
  2811 
  2915 
  2812 	/* Media tabs on the top */
  2916 	/* Media tabs on the top */
  2813 	.media-frame-content .media-toolbar .instructions {
  2917 	.media-frame-content .media-toolbar .instructions {
  2814 		display: none;
  2918 		display: none;
  2815 	}
  2919 	}
       
  2920 
       
  2921 	/* Change margin direction on load more button in responsive views. */
       
  2922 	.load-more-wrapper .load-more-jump {
       
  2923 		margin: 12px 0 0 0;
       
  2924 	}
       
  2925 
  2816 }
  2926 }
  2817 
  2927 
  2818 @media only screen and (min-width: 901px) and (max-height: 400px) {
  2928 @media only screen and (min-width: 901px) and (max-height: 400px) {
  2819 	.media-menu,
  2929 	.media-menu,
  2820 	.media-frame:not(.hide-menu) .media-menu {
  2930 	.media-frame:not(.hide-menu) .media-menu {
  2821 		top: 0;
  2931 		top: 0;
  2822 		padding-top: 44px;
  2932 		padding-top: 44px;
  2823 	}
  2933 	}
       
  2934 
       
  2935 	/* Change margin direction on load more button in responsive views. */
       
  2936 	.load-more-wrapper .load-more-jump {
       
  2937 		margin: 12px 0 0 0;
       
  2938 	}
       
  2939 
  2824 }
  2940 }
  2825 
  2941 
  2826 @media only screen and (max-width: 480px) {
  2942 @media only screen and (max-width: 480px) {
  2827 	.wp-core-ui.wp-customizer .media-button {
  2943 	.wp-core-ui.wp-customizer .media-button {
  2828 		margin-top: 13px;
  2944 		margin-top: 13px;