wp/wp-admin/css/forms.css
changeset 5 5e2f62d02dcd
child 7 cf61fcea0001
equal deleted inserted replaced
4:346c88efed21 5:5e2f62d02dcd
       
     1 /* Include margin and padding in the width calculation of input and textarea. */
       
     2 input,
       
     3 textarea {
       
     4 	-webkit-box-sizing: border-box;
       
     5 	-moz-box-sizing: border-box;
       
     6 	box-sizing: border-box;
       
     7 }
       
     8 
       
     9 input[type="text"],
       
    10 input[type="password"],
       
    11 input[type="checkbox"],
       
    12 input[type="color"],
       
    13 input[type="date"],
       
    14 input[type="datetime"],
       
    15 input[type="datetime-local"],
       
    16 input[type="email"],
       
    17 input[type="month"],
       
    18 input[type="number"],
       
    19 input[type="password"],
       
    20 input[type="search"],
       
    21 input[type="radio"],
       
    22 input[type="tel"],
       
    23 input[type="text"],
       
    24 input[type="time"],
       
    25 input[type="url"],
       
    26 input[type="week"],
       
    27 select,
       
    28 textarea {
       
    29 	border: 1px solid #ddd;
       
    30 	-webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
       
    31 	box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
       
    32 	background-color: #fff;
       
    33 	color: #32373c;
       
    34 	outline: none;
       
    35 	-webkit-transition: 0.05s border-color ease-in-out;
       
    36 	transition: 0.05s border-color ease-in-out;
       
    37 }
       
    38 
       
    39 input[type="text"]:focus,
       
    40 input[type="password"]:focus,
       
    41 input[type="color"]:focus,
       
    42 input[type="date"]:focus,
       
    43 input[type="datetime"]:focus,
       
    44 input[type="datetime-local"]:focus,
       
    45 input[type="email"]:focus,
       
    46 input[type="month"]:focus,
       
    47 input[type="number"]:focus,
       
    48 input[type="password"]:focus,
       
    49 input[type="search"]:focus,
       
    50 input[type="tel"]:focus,
       
    51 input[type="text"]:focus,
       
    52 input[type="time"]:focus,
       
    53 input[type="url"]:focus,
       
    54 input[type="week"]:focus,
       
    55 input[type="checkbox"]:focus,
       
    56 input[type="radio"]:focus,
       
    57 select:focus,
       
    58 textarea:focus {
       
    59 	border-color: #5b9dd9;
       
    60 	-webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
       
    61 	box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
       
    62 }
       
    63 
       
    64 /* rtl:ignore */
       
    65 input[type="email"],
       
    66 input[type="url"] {
       
    67 	direction: ltr;
       
    68 }
       
    69 
       
    70 input[type="checkbox"],
       
    71 input[type="radio"] {
       
    72 	border: 1px solid #b4b9be;
       
    73 	background: #fff;
       
    74 	color: #555;
       
    75 	clear: none;
       
    76 	cursor: pointer;
       
    77 	display: inline-block;
       
    78 	line-height: 0;
       
    79 	height: 16px;
       
    80 	margin: -4px 4px 0 0;
       
    81 	outline: 0;
       
    82 	padding: 0 !important;
       
    83 	text-align: center;
       
    84 	vertical-align: middle;
       
    85 	width: 16px;
       
    86 	min-width: 16px;
       
    87 	-webkit-appearance: none;
       
    88 	-webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
       
    89 	box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
       
    90 	-webkit-transition: .05s border-color ease-in-out;
       
    91 	transition: .05s border-color ease-in-out;
       
    92 }
       
    93 
       
    94 input[type="radio"]:checked + label:before {
       
    95 	color: #82878c;
       
    96 }
       
    97 
       
    98 .wp-core-ui input[type="reset"]:hover,
       
    99 .wp-core-ui input[type="reset"]:active {
       
   100 	color: #00a0d2;
       
   101 }
       
   102 
       
   103 td > input[type="checkbox"],
       
   104 .wp-admin p input[type="checkbox"],
       
   105 .wp-admin p input[type="radio"] {
       
   106 	margin-top: 0;
       
   107 }
       
   108 
       
   109 .wp-admin p label input[type="checkbox"] {
       
   110 	margin-top: -4px;
       
   111 }
       
   112 
       
   113 .wp-admin p label input[type="radio"] {
       
   114 	margin-top: -2px;
       
   115 }
       
   116 
       
   117 input[type="radio"] {
       
   118 	-webkit-border-radius: 50%;
       
   119 	border-radius: 50%;
       
   120 	margin-right: 4px;
       
   121 	line-height: 10px;
       
   122 }
       
   123 
       
   124 input[type="checkbox"]:checked:before,
       
   125 input[type="radio"]:checked:before {
       
   126 	float: left;
       
   127 	display: inline-block;
       
   128 	vertical-align: middle;
       
   129 	width: 16px;
       
   130 	font: normal 21px/1 'dashicons';
       
   131 	speak: none;
       
   132 	-webkit-font-smoothing: antialiased;
       
   133 	-moz-osx-font-smoothing: grayscale;
       
   134 }
       
   135 
       
   136 input[type="checkbox"]:checked:before {
       
   137 	content: '\f147';
       
   138 	margin: -3px 0 0 -4px;
       
   139 	color: #1e8cbe;
       
   140 }
       
   141 
       
   142 input[type="radio"]:checked:before {
       
   143 	content: '\2022';
       
   144 	text-indent: -9999px;
       
   145 	-webkit-border-radius: 50px;
       
   146 	border-radius: 50px;
       
   147 	font-size: 24px;
       
   148 	width: 6px;
       
   149 	height: 6px;
       
   150 	margin: 4px;
       
   151 	line-height: 16px;
       
   152 	background-color: #1e8cbe;
       
   153 }
       
   154 
       
   155 @-moz-document url-prefix() {
       
   156 	input[type="checkbox"],
       
   157 	input[type="radio"],
       
   158 	.form-table input.tog {
       
   159 		margin-bottom: -1px;
       
   160 	}
       
   161 }
       
   162 
       
   163 /* Search */
       
   164 input[type="search"] {
       
   165 	-webkit-appearance: textfield;
       
   166 }
       
   167 
       
   168 input[type="search"]::-webkit-search-decoration {
       
   169 	display: none;
       
   170 }
       
   171 
       
   172 .ie8 input[type="password"] {
       
   173 	font-family: sans-serif;
       
   174 }
       
   175 
       
   176 textarea,
       
   177 input,
       
   178 select,
       
   179 button {
       
   180 	font-family: inherit;
       
   181 	font-size: inherit;
       
   182 	font-weight: inherit;
       
   183 }
       
   184 
       
   185 textarea,
       
   186 input,
       
   187 select {
       
   188 	font-size: 14px;
       
   189 	padding: 3px 5px;
       
   190 	-webkit-border-radius: 0;
       
   191 	border-radius: 0; /* Reset mobile webkit's default element styling */
       
   192 }
       
   193 
       
   194 textarea {
       
   195 	overflow: auto;
       
   196 	padding: 2px 6px;
       
   197 	line-height: 1.4;
       
   198 }
       
   199 
       
   200 .wp-admin input[type="file"] {
       
   201 	padding: 3px 0;
       
   202 }
       
   203 
       
   204 label {
       
   205 	cursor: pointer;
       
   206 }
       
   207 
       
   208 input,
       
   209 select {
       
   210 	margin: 1px;
       
   211 	padding: 3px 5px;
       
   212 }
       
   213 
       
   214 input.code {
       
   215 	padding-top: 6px;
       
   216 }
       
   217 
       
   218 textarea.code {
       
   219 	line-height: 1.4;
       
   220 	padding: 4px 6px 1px 6px;
       
   221 }
       
   222 
       
   223 input.readonly,
       
   224 input[readonly],
       
   225 textarea.readonly,
       
   226 textarea[readonly] {
       
   227 	background-color: #eee;
       
   228 }
       
   229 
       
   230 :-moz-placeholder,
       
   231 .wp-core-ui :-moz-placeholder {
       
   232    color: #a9a9a9;
       
   233 }
       
   234 
       
   235 .form-invalid {
       
   236 	background-color: #ffebe8 !important;
       
   237 }
       
   238 
       
   239 .form-invalid input,
       
   240 .form-invalid select {
       
   241 	border-color: #c00 !important;
       
   242 }
       
   243 
       
   244 .form-input-tip {
       
   245 	color: #666;
       
   246 }
       
   247 
       
   248 input:disabled,
       
   249 input.disabled,
       
   250 select:disabled,
       
   251 select.disabled,
       
   252 textarea:disabled,
       
   253 textarea.disabled {
       
   254 	background: rgba( 255, 255, 255, 0.5 );
       
   255 	border-color: rgba( 222, 222, 222, 0.75 );
       
   256 	-webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
       
   257 	box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
       
   258 	color: rgba( 51, 51, 51, 0.5 );
       
   259 }
       
   260 
       
   261 input[type="file"]:disabled,
       
   262 input[type="file"].disabled,
       
   263 input[type="range"]:disabled,
       
   264 input[type="range"].disabled {
       
   265 	background: none;
       
   266 	-webkit-box-shadow: none;
       
   267 	box-shadow: none;
       
   268 }
       
   269 
       
   270 input[type="checkbox"]:disabled,
       
   271 input[type="checkbox"].disabled,
       
   272 input[type="radio"]:disabled,
       
   273 input[type="radio"].disabled,
       
   274 input[type="checkbox"]:disabled:checked:before,
       
   275 input[type="checkbox"].disabled:checked:before,
       
   276 input[type="radio"]:disabled:checked:before,
       
   277 input[type="radio"].disabled:checked:before {
       
   278 	opacity: 0.7;
       
   279 }
       
   280 
       
   281 /*------------------------------------------------------------------------------
       
   282   2.0 - Forms
       
   283 ------------------------------------------------------------------------------*/
       
   284 
       
   285 
       
   286 .wp-admin select {
       
   287 	padding: 2px;
       
   288 	line-height: 28px;
       
   289 	height: 28px;
       
   290 	vertical-align: middle;
       
   291 }
       
   292 
       
   293 .wp-admin .button-cancel {
       
   294 	padding: 0 5px;
       
   295 	line-height: 2;
       
   296 }
       
   297 
       
   298 .meta-box-sortables select {
       
   299 	max-width: 100%;
       
   300 }
       
   301 
       
   302 .wp-admin select[multiple] {
       
   303 	height: auto;
       
   304 }
       
   305 
       
   306 .submit {
       
   307 	padding: 1.5em 0;
       
   308 	margin: 5px 0;
       
   309 	-webkit-border-bottom-left-radius: 3px;
       
   310 	border-bottom-left-radius: 3px;
       
   311 	-webkit-border-bottom-right-radius: 3px;
       
   312 	border-bottom-right-radius: 3px;
       
   313 	border: none;
       
   314 }
       
   315 
       
   316 form p.submit a.cancel:hover {
       
   317 	text-decoration: none;
       
   318 }
       
   319 
       
   320 p.submit {
       
   321 	text-align: left;
       
   322 	max-width: 100%;
       
   323 	margin-top: 20px;
       
   324 	padding-top: 10px;
       
   325 }
       
   326 
       
   327 .textright p.submit {
       
   328 	border: none;
       
   329 	text-align: right;
       
   330 }
       
   331 
       
   332 table.form-table + p.submit,
       
   333 table.form-table + input + p.submit,
       
   334 table.form-table + input + input + p.submit {
       
   335 	border-top: none;
       
   336 	padding-top: 0;
       
   337 }
       
   338 
       
   339 #minor-publishing-actions input,
       
   340 #major-publishing-actions input,
       
   341 #minor-publishing-actions .preview {
       
   342 	text-align: center;
       
   343 }
       
   344 
       
   345 textarea.all-options,
       
   346 input.all-options {
       
   347 	width: 250px;
       
   348 }
       
   349 
       
   350 input.large-text,
       
   351 textarea.large-text {
       
   352 	width: 99%;
       
   353 }
       
   354 
       
   355 input.regular-text,
       
   356 #adduser .form-field input {
       
   357 	width: 25em;
       
   358 }
       
   359 
       
   360 input.small-text {
       
   361 	width: 50px;
       
   362 	padding: 1px 6px;
       
   363 }
       
   364 
       
   365 input[type="number"].small-text {
       
   366 	width: 65px;
       
   367 }
       
   368 
       
   369 #doaction,
       
   370 #doaction2,
       
   371 #post-query-submit {
       
   372 	margin: 1px 8px 0 0;
       
   373 }
       
   374 
       
   375 .tablenav #changeit,
       
   376 .tablenav #delete_all,
       
   377 .tablenav #clear-recent-list,
       
   378 .wp-filter #delete_all {
       
   379 	margin-top: 1px;
       
   380 }
       
   381 
       
   382 .tablenav .actions select {
       
   383 	float: left;
       
   384 	margin-right: 6px;
       
   385 	max-width: 200px;
       
   386 }
       
   387 
       
   388 .ie8 .tablenav .actions select {
       
   389 	width: 155px;
       
   390 }
       
   391 
       
   392 .ie8 .tablenav .actions select#cat {
       
   393 	width: 200px;
       
   394 }
       
   395 
       
   396 #timezone_string option {
       
   397 	margin-left: 1em;
       
   398 }
       
   399 
       
   400 #upload-form label {
       
   401 	color: #777;
       
   402 }
       
   403 
       
   404 label,
       
   405 #your-profile label + a {
       
   406 	vertical-align: middle;
       
   407 }
       
   408 
       
   409 fieldset label,
       
   410 #your-profile label + a {
       
   411 	vertical-align: middle;
       
   412 }
       
   413 
       
   414 .options-media-php label[for*="_size_"],
       
   415 #misc-publishing-actions label {
       
   416 	vertical-align: baseline;
       
   417 }
       
   418 
       
   419 #misc-publishing-actions label[for="post_status"]:before {
       
   420 	content: '\f173';
       
   421 	display: inline-block;
       
   422 	font: normal 20px/1 'dashicons';
       
   423 	speak: none;
       
   424 	left: -1px;
       
   425 	padding: 0 5px 0 0;
       
   426 	position: relative;
       
   427 	top: 0;
       
   428 	text-decoration: none !important;
       
   429 	vertical-align: top;
       
   430 	-webkit-font-smoothing: antialiased;
       
   431 	-moz-osx-font-smoothing: grayscale;
       
   432 }
       
   433 
       
   434 #pass-strength-result {
       
   435 	background-color: #eee;
       
   436 	border: 1px solid #ddd;
       
   437 	float: left;
       
   438 	margin: 13px 5px 5px 1px;
       
   439 	padding: 3px 5px;
       
   440 	text-align: center;
       
   441 	width: 200px;
       
   442 	display: none;
       
   443 }
       
   444 
       
   445 #pass-strength-result.short {
       
   446 	background-color: #ffa0a0;
       
   447 	border-color: #f04040;
       
   448 }
       
   449 
       
   450 #pass-strength-result.bad {
       
   451 	background-color: #ffb78c;
       
   452 	border-color: #ff853c;
       
   453 }
       
   454 
       
   455 #pass-strength-result.good {
       
   456 	background-color: #ffec8b;
       
   457 	border-color: #fc0;
       
   458 }
       
   459 
       
   460 #pass-strength-result.strong {
       
   461 	background-color: #c3ff88;
       
   462 	border-color: #8dff1c;
       
   463 }
       
   464 
       
   465 .indicator-hint {
       
   466 	padding-top: 8px;
       
   467 }
       
   468 
       
   469 p.search-box {
       
   470 	float: right;
       
   471 	margin: 0;
       
   472 }
       
   473 
       
   474 .network-admin.themes-php p.search-box {
       
   475 	clear: left;
       
   476 }
       
   477 
       
   478 .search-box input[name="s"],
       
   479 .tablenav .search-plugins input[name="s"],
       
   480 .tagsdiv .newtag {
       
   481 	float: left;
       
   482 	height: 28px;
       
   483 	margin: 0 4px 0 0;
       
   484 }
       
   485 
       
   486 input[type="text"].ui-autocomplete-loading,
       
   487 input[type="email"].ui-autocomplete-loading {
       
   488 	background-image: url(../images/loading.gif);
       
   489 	background-repeat: no-repeat;
       
   490 	background-position: right center;
       
   491 	visibility: visible;
       
   492 }
       
   493 
       
   494 input.ui-autocomplete-input.open {
       
   495 	border-bottom-color: transparent;
       
   496 }
       
   497 
       
   498 ul#add-to-blog-users {
       
   499 	margin: 0 0 0 14px;
       
   500 }
       
   501 
       
   502 .ui-autocomplete {
       
   503 	padding: 0;
       
   504 	margin: 0;
       
   505 	list-style: none;
       
   506 	position: absolute;
       
   507 	z-index: 10000;
       
   508 	border: 1px solid #5b9dd9;
       
   509 	-webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
       
   510 	box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
       
   511 	background-color: #fff;
       
   512 }
       
   513 
       
   514 .ui-autocomplete li {
       
   515 	margin-bottom: 0;
       
   516 	padding: 4px 10px;
       
   517 	white-space: nowrap;
       
   518 	text-align: left;
       
   519 }
       
   520 
       
   521 .ui-autocomplete li.ui-state-focus {
       
   522 	background-color: #ddd;
       
   523 	cursor: pointer;
       
   524 }
       
   525 
       
   526 /*------------------------------------------------------------------------------
       
   527   15.0 - Comments Screen
       
   528 ------------------------------------------------------------------------------*/
       
   529 
       
   530 .form-table {
       
   531 	border-collapse: collapse;
       
   532 	margin-top: 0.5em;
       
   533 	width: 100%;
       
   534 	clear: both;
       
   535 }
       
   536 
       
   537 .form-table,
       
   538 .form-table td,
       
   539 .form-table th,
       
   540 .form-table td p,
       
   541 .form-wrap label {
       
   542 	font-size: 14px;
       
   543 }
       
   544 
       
   545 .form-table td {
       
   546 	margin-bottom: 9px;
       
   547 	padding: 15px 10px;
       
   548 	line-height: 1.3;
       
   549 	vertical-align: middle;
       
   550 }
       
   551 
       
   552 .form-table th,
       
   553 .form-wrap label {
       
   554 	color: #23282d;
       
   555 	font-weight: normal;
       
   556 	text-shadow: none;
       
   557 	vertical-align: baseline;
       
   558 }
       
   559 
       
   560 .form-table th {
       
   561 	vertical-align: top;
       
   562 	text-align: left;
       
   563 	padding: 20px 10px 20px 0;
       
   564 	width: 200px;
       
   565 	line-height: 1.3;
       
   566 	font-weight: 600;
       
   567 }
       
   568 
       
   569 .form-table th.th-full {
       
   570 	width: auto;
       
   571 	font-weight: 400;
       
   572 }
       
   573 
       
   574 .form-table td p {
       
   575 	margin-top: 4px;
       
   576 	margin-bottom: 0;
       
   577 }
       
   578 
       
   579 .form-table td fieldset label {
       
   580 	margin: 0.25em 0 0.5em !important;
       
   581 	display: inline-block;
       
   582 }
       
   583 
       
   584 .form-table td fieldset label,
       
   585 .form-table td fieldset p,
       
   586 .form-table td fieldset li {
       
   587 	line-height: 1.4em;
       
   588 }
       
   589 
       
   590 .form-table input.tog,
       
   591 .form-table input[type="radio"] {
       
   592 	margin-top: -4px;
       
   593 	margin-right: 4px;
       
   594 	float: none;
       
   595 }
       
   596 
       
   597 .form-table .pre {
       
   598 	padding: 8px;
       
   599 	margin: 0;
       
   600 }
       
   601 
       
   602 table.form-table td .updated {
       
   603 	font-size: 13px;
       
   604 }
       
   605 
       
   606 table.form-table td .updated p {
       
   607 	font-size: 13px;
       
   608 	margin: 0.3em 0;
       
   609 }
       
   610 
       
   611 /*------------------------------------------------------------------------------
       
   612   18.0 - Users
       
   613 ------------------------------------------------------------------------------*/
       
   614 
       
   615 #profile-page .form-table textarea {
       
   616 	width: 500px;
       
   617 	margin-bottom: 6px;
       
   618 }
       
   619 
       
   620 #profile-page .form-table #rich_editing {
       
   621 	margin-right: 5px
       
   622 }
       
   623 
       
   624 #your-profile legend {
       
   625 	font-size: 22px;
       
   626 }
       
   627 
       
   628 #display_name {
       
   629 	width: 15em;
       
   630 }
       
   631 
       
   632 #createuser .form-field input {
       
   633 	width: 25em;
       
   634 }
       
   635 
       
   636 .color-option {
       
   637 	display: inline-block;
       
   638 	width: 24%;
       
   639 	padding: 5px 15px 15px;
       
   640 	-webkit-box-sizing: border-box;
       
   641 	-moz-box-sizing: border-box;
       
   642 	box-sizing: border-box;
       
   643 	margin-bottom: 3px;
       
   644 }
       
   645 
       
   646 .color-option:hover,
       
   647 .color-option.selected {
       
   648 	background: #ddd;
       
   649 }
       
   650 
       
   651 .color-palette {
       
   652 	width: 100%;
       
   653 	border-spacing: 0;
       
   654 	border-collapse: collapse;
       
   655 }
       
   656 .color-palette td {
       
   657 	height: 20px;
       
   658 	padding: 0;
       
   659 	border: none;
       
   660 }
       
   661 
       
   662 .color-option {
       
   663 	cursor: pointer;
       
   664 }
       
   665 
       
   666 /*------------------------------------------------------------------------------
       
   667   19.0 - Tools
       
   668 ------------------------------------------------------------------------------*/
       
   669 
       
   670 .tool-box .title {
       
   671 	margin: 8px 0;
       
   672 	font-size: 18px;
       
   673 	font-weight: normal;
       
   674 	line-height: 24px;
       
   675 }
       
   676 
       
   677 /* Card styles */
       
   678 
       
   679 .card {
       
   680 	position: relative;
       
   681 	margin-top: 20px;
       
   682 	padding: 0.7em 2em 1em;
       
   683 	min-width: 255px;
       
   684 	max-width: 520px;
       
   685 	border: 1px solid #e5e5e5;
       
   686 	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
       
   687 	box-shadow: 0 1px 1px rgba(0,0,0,0.04);
       
   688 	background: #fff;
       
   689 }
       
   690 
       
   691 /* Press this styles */
       
   692 
       
   693 .pressthis h4 {
       
   694 	margin: 2em 0 1em;
       
   695 }
       
   696 
       
   697 .pressthis textarea {
       
   698 	width: 100%;
       
   699 	font-size: 1em;
       
   700 }
       
   701 
       
   702 #pressthis-code-wrap {
       
   703 	overflow: auto;
       
   704 }
       
   705 
       
   706 .pressthis-bookmarklet-wrapper {
       
   707 	margin: 20px 0 8px;
       
   708 	vertical-align: top;
       
   709 	position: relative;
       
   710 	z-index: 1;
       
   711 }
       
   712 
       
   713 .pressthis-bookmarklet,
       
   714 .pressthis-bookmarklet:hover,
       
   715 .pressthis-bookmarklet:focus,
       
   716 .pressthis-bookmarklet:active {
       
   717 	display: inline-block;
       
   718 	position: relative;
       
   719 	cursor: move;
       
   720 	color: #32373c;
       
   721 	background: #e6e6e6;
       
   722 	-webkit-border-radius: 5px;
       
   723 	border-radius: 5px;
       
   724 	border: 1px solid #b4b4b4;
       
   725 	font-style: normal;
       
   726 	line-height: 16px;
       
   727 	font-size: 14px;
       
   728 	text-decoration: none;
       
   729 }
       
   730 
       
   731 .pressthis-bookmarklet:active {
       
   732 	outline: none;
       
   733 }
       
   734 
       
   735 .pressthis-bookmarklet:after {
       
   736 	content: '';
       
   737 	width: 70%;
       
   738 	height: 55%;
       
   739 	z-index: -1;
       
   740 	position: absolute;
       
   741 	right: 10px;
       
   742 	bottom: 9px;
       
   743 	background: transparent;
       
   744 	-webkit-transform: skew(20deg) rotate(6deg);
       
   745 	-ms-transform: skew(20deg) rotate(6deg);
       
   746 	transform: skew(20deg) rotate(6deg);
       
   747 	-webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
       
   748 	box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
       
   749 }
       
   750 
       
   751 .pressthis-bookmarklet:hover:after {
       
   752 	-webkit-transform: skew(20deg) rotate(9deg);
       
   753 	-ms-transform: skew(20deg) rotate(9deg);
       
   754 	transform: skew(20deg) rotate(9deg);
       
   755 	-webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
       
   756 	box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
       
   757 }
       
   758 
       
   759 .pressthis-bookmarklet span {
       
   760 	display: inline-block;
       
   761 	margin: 0px 0 0;
       
   762 	padding: 0px 12px 8px 9px;
       
   763 }
       
   764 
       
   765 .pressthis-bookmarklet span:before {
       
   766 	color: #777;
       
   767 	font: normal 20px/1 'dashicons';
       
   768 	content:'\f157';
       
   769 	position: relative;
       
   770 	display: inline-block;
       
   771 	top: 4px;
       
   772 	margin-right: 4px;
       
   773 }
       
   774 
       
   775 .pressthis-js-toggle {
       
   776 	margin-left: 10px;
       
   777 	padding: 0;
       
   778 	height: auto;
       
   779 	vertical-align: top;
       
   780 }
       
   781 
       
   782 .pressthis-js-toggle .dashicons {
       
   783 	margin: 5px 8px 6px 7px;
       
   784 	color: #777;
       
   785 }
       
   786 
       
   787 /* to override the button class being applied */
       
   788 .pressthis-js-toggle.button.button {
       
   789 	margin-left: 10px;
       
   790 	padding: 0;
       
   791 	height: auto;
       
   792 	vertical-align: top;
       
   793 }
       
   794 
       
   795 .pressthis-js-toggle .dashicons {
       
   796 	margin: 5px 8px 6px 7px;
       
   797 	color: #777;
       
   798 }
       
   799 
       
   800 /*------------------------------------------------------------------------------
       
   801   20.0 - Settings
       
   802 ------------------------------------------------------------------------------*/
       
   803 
       
   804 #utc-time, #local-time {
       
   805 	padding-left: 25px;
       
   806 	font-style: italic;
       
   807 }
       
   808 
       
   809 .defaultavatarpicker .avatar {
       
   810 	margin: 2px 0;
       
   811 	vertical-align: middle;
       
   812 }
       
   813 
       
   814 .options-general-php input.small-text {
       
   815 	width: 56px;
       
   816 }
       
   817 
       
   818 .options-general-php .spinner {
       
   819 	float: none;
       
   820 	margin: 0 3px;
       
   821 }
       
   822 
       
   823 .settings-php .language-install-spinner,
       
   824 .options-general-php .language-install-spinner {
       
   825 	display: inline-block;
       
   826 	float: none;
       
   827 	margin: -3px 5px 0;
       
   828 	vertical-align: middle;
       
   829 }
       
   830 
       
   831 /*------------------------------------------------------------------------------
       
   832   21.0 - Network Admin
       
   833 ------------------------------------------------------------------------------*/
       
   834 
       
   835 .form-field #site-address {
       
   836 	max-width: 25em;
       
   837 }
       
   838 
       
   839 .form-field #domain {
       
   840 	max-width: 22em;
       
   841 }
       
   842 
       
   843 .form-field #site-title,
       
   844 .form-field #admin-email,
       
   845 .form-field #path,
       
   846 .form-field #blog_registered,
       
   847 .form-field #blog_last_updated {
       
   848 	max-width: 25em;
       
   849 }
       
   850 
       
   851 .form-field #path {
       
   852 	margin-bottom: 5px;
       
   853 }
       
   854 
       
   855 /*------------------------------------------------------------------------------
       
   856    Credentials check dialog for Install and Updates
       
   857 ------------------------------------------------------------------------------*/
       
   858 
       
   859 .request-filesystem-credentials-dialog {
       
   860 	display: none;
       
   861 }
       
   862 
       
   863 .request-filesystem-credentials-dialog .notification-dialog {
       
   864 	top: 15%;
       
   865 }
       
   866 
       
   867 .request-filesystem-credentials-dialog-content {
       
   868 	margin: 25px;
       
   869 }
       
   870 
       
   871 .request-filesystem-credentials-form input[type="text"],
       
   872 .request-filesystem-credentials-form input[type="password"] {
       
   873 	display: block;
       
   874 }
       
   875 
       
   876 .request-filesystem-credentials-dialog input[type="text"],
       
   877 .request-filesystem-credentials-dialog input[type="password"] {
       
   878 	width: 100%;
       
   879 }
       
   880 
       
   881 .request-filesystem-credentials-form .field-title {
       
   882 	font-weight: 600;
       
   883 }
       
   884 
       
   885 .request-filesystem-credentials-dialog label[for="hostname"],
       
   886 .request-filesystem-credentials-dialog label[for="public_key"],
       
   887 .request-filesystem-credentials-dialog label[for="private_key"] {
       
   888 	display: block;
       
   889 	margin-bottom: 1em;
       
   890 }
       
   891 
       
   892 .request-filesystem-credentials-dialog .ftp-username,
       
   893 .request-filesystem-credentials-dialog .ftp-password {
       
   894 	float: left;
       
   895 	width: 48%;
       
   896 }
       
   897 
       
   898 .request-filesystem-credentials-dialog .ftp-password {
       
   899 	margin-left: 4%;
       
   900 }
       
   901 
       
   902 .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
       
   903 	text-align: right;
       
   904 }
       
   905 
       
   906 .request-filesystem-credentials-dialog label[for="ftp"] {
       
   907 	margin-right: 10px;
       
   908 }
       
   909 
       
   910 #request-filesystem-credentials-dialog .button:not(:last-child) {
       
   911 	margin-right: 10px;
       
   912 }
       
   913 
       
   914 #request-filesystem-credentials-form .cancel-button {
       
   915 	display: none;
       
   916 }
       
   917 
       
   918 #request-filesystem-credentials-dialog .cancel-button {
       
   919 	display: inline;
       
   920 }
       
   921 
       
   922 
       
   923 /* =Media Queries
       
   924 -------------------------------------------------------------- */
       
   925 
       
   926 @media screen and ( max-width: 782px ) {
       
   927 	/* Input Elements */
       
   928 	textarea {
       
   929 		-webkit-appearance: none;
       
   930 	}
       
   931 
       
   932 	input[type="text"],
       
   933 	input[type="email"],
       
   934 	input[type="search"],
       
   935 	input[type="password"],
       
   936 	input[type="number"] {
       
   937 		-webkit-appearance: none;
       
   938 		padding: 6px 10px;
       
   939 	}
       
   940 
       
   941 	input.code {
       
   942 		padding-bottom: 5px;
       
   943 		padding-top: 10px;
       
   944 	}
       
   945 
       
   946 	input[type="checkbox"], .widefat th input[type="checkbox"] {
       
   947 		-webkit-appearance: none;
       
   948 		padding: 10px;
       
   949 	}
       
   950 
       
   951 	.widefat th input[type="checkbox"] {
       
   952 		margin-bottom: 8px;
       
   953 	}
       
   954 
       
   955 	input[type="checkbox"]:checked:before, .widefat th input[type="checkbox"]:before {
       
   956 		font: normal 30px/1 'Dashicons';
       
   957 		margin: -3px -5px;
       
   958 	}
       
   959 
       
   960 	input[type="radio"],
       
   961 	input[type="checkbox"] {
       
   962 		height: 25px;
       
   963 		width: 25px;
       
   964 	}
       
   965 
       
   966 	.wp-admin p input[type="checkbox"],
       
   967 	.wp-admin p input[type="radio"] {
       
   968 		margin-top: -3px;
       
   969 	}
       
   970 
       
   971 	input[type="radio"]:checked:before {
       
   972 		vertical-align: middle;
       
   973 		width: 9px;
       
   974 		height: 9px;
       
   975 		margin: 7px;
       
   976 		line-height: 16px;
       
   977 	}
       
   978 
       
   979 	.wp-upload-form input[type="submit"] {
       
   980 		margin-top: 10px;
       
   981 	}
       
   982 
       
   983 	#wpbody select {
       
   984 		height: 36px;
       
   985 		font-size: 16px;
       
   986 	}
       
   987 
       
   988 	.wp-admin .button-cancel {
       
   989 		padding: 0;
       
   990 		font-size: 14px;
       
   991 	}
       
   992 
       
   993 	#createuser .form-field input {
       
   994 		width: 100%;
       
   995 	}
       
   996 
       
   997 	.form-table {
       
   998 		-webkit-box-sizing: border-box;
       
   999 		-moz-box-sizing: border-box;
       
  1000 		box-sizing: border-box;
       
  1001 	}
       
  1002 
       
  1003 	.form-table th,
       
  1004 	.form-table td {
       
  1005 		display: block;
       
  1006 		width: auto;
       
  1007 		vertical-align: middle;
       
  1008 	}
       
  1009 
       
  1010 	.form-table .color-palette td {
       
  1011 		display: table-cell;
       
  1012 		width: 15px;
       
  1013 	}
       
  1014 
       
  1015 	.form-table table.color-palette {
       
  1016 		margin-right: 10px;
       
  1017 	}
       
  1018 
       
  1019 	textarea,
       
  1020 	input {
       
  1021 		font-size: 16px;
       
  1022 	}
       
  1023 
       
  1024 	.form-table td input[type="text"],
       
  1025 	.form-table td input[type="email"],
       
  1026 	.form-table td input[type="password"],
       
  1027 	.form-table td select,
       
  1028 	.form-table td textarea,
       
  1029 	.form-table span.description,
       
  1030 	#profile-page .form-table textarea {
       
  1031 		width: 100%;
       
  1032 		font-size: 16px;
       
  1033 		line-height: 1.5;
       
  1034 		padding: 7px 10px;
       
  1035 		display: block;
       
  1036 		max-width: none;
       
  1037 		-webkit-box-sizing: border-box;
       
  1038 		-moz-box-sizing: border-box;
       
  1039 		box-sizing: border-box;
       
  1040 	}
       
  1041 
       
  1042 	#wpbody .form-table td select {
       
  1043 		height: 40px;
       
  1044 	}
       
  1045 
       
  1046 	input[type="text"].small-text,
       
  1047 	input[type="search"].small-text,
       
  1048 	input[type="password"].small-text,
       
  1049 	input[type="number"].small-text,
       
  1050 	input[type="number"].small-text,
       
  1051 	.form-table input[type="text"].small-text {
       
  1052 		width: auto;
       
  1053 		max-width: 55px;
       
  1054 		display: inline;
       
  1055 		padding: 3px 6px;
       
  1056 		margin: 0 3px;
       
  1057 	}
       
  1058 
       
  1059 	#pass-strength-result {
       
  1060 		width: 100%;
       
  1061 		-webkit-box-sizing: border-box;
       
  1062 		-moz-box-sizing: border-box;
       
  1063 		box-sizing: border-box;
       
  1064 		padding: 8px;
       
  1065 	}
       
  1066 
       
  1067 	p.search-box {
       
  1068 		float: none;
       
  1069 		position: absolute;
       
  1070 		bottom: 0;
       
  1071 		width: 98%;
       
  1072 		height: 90px;
       
  1073 		margin-bottom: 20px;
       
  1074 	}
       
  1075 
       
  1076 	p.search-box input[name="s"] {
       
  1077 		height: auto;
       
  1078 		float: none;
       
  1079 		width: 100%;
       
  1080 		margin-bottom: 10px;
       
  1081 		vertical-align: middle;
       
  1082 		-webkit-appearance: none;
       
  1083 	}
       
  1084 
       
  1085 	p.search-box input[type="submit"] {
       
  1086 		margin-bottom: 10px;
       
  1087 	}
       
  1088 
       
  1089 	.form-table span.description {
       
  1090 		padding: 4px 0 0;
       
  1091 		line-height: 1.4em;
       
  1092 	}
       
  1093 
       
  1094 	.form-table th {
       
  1095 		padding-top: 10px;
       
  1096 		padding-bottom: 0;
       
  1097 		border-bottom: 0;
       
  1098 	}
       
  1099 
       
  1100 	.form-table td {
       
  1101 		padding-top: 8px;
       
  1102 		padding-left: 0;
       
  1103 	}
       
  1104 
       
  1105 	.form-table input.regular-text {
       
  1106 		width: 100%;
       
  1107 	}
       
  1108 
       
  1109 	.form-table label {
       
  1110 		font-size: 14px;
       
  1111 	}
       
  1112 
       
  1113 	.form-table fieldset label {
       
  1114 		display: block;
       
  1115 	}
       
  1116 
       
  1117 	#utc-time {
       
  1118 		margin-top: 10px;
       
  1119 	}
       
  1120 
       
  1121 	#utc-time,
       
  1122 	#local-time {
       
  1123 		display: block;
       
  1124 		float: none;
       
  1125 		padding: 0;
       
  1126 		line-height: 2;
       
  1127 	}
       
  1128 
       
  1129 	.form-field #domain {
       
  1130 		max-width: none;
       
  1131 	}
       
  1132 }
       
  1133 
       
  1134 @media only screen and (max-width: 768px) {
       
  1135 	.form-field input[type="text"],
       
  1136 	.form-field input[type="email"],
       
  1137 	.form-field input[type="password"],
       
  1138 	.form-field select,
       
  1139 	.form-field textarea {
       
  1140 		width: 99%;
       
  1141 	}
       
  1142 
       
  1143 	.form-wrap .form-field {
       
  1144 		padding:0;
       
  1145 	}
       
  1146 
       
  1147 	/* users */
       
  1148 	#profile-page .form-table textarea {
       
  1149 		max-width: 400px;
       
  1150 		width: auto;
       
  1151 	}
       
  1152 
       
  1153 }
       
  1154 
       
  1155 @media only screen and (max-height: 480px) {
       
  1156 	/*  Request Credentials */
       
  1157 	.request-filesystem-credentials-dialog	.notification-dialog{
       
  1158 		width: 100%;
       
  1159 		height: 100%;
       
  1160 		position: fixed;
       
  1161 		top: 0;
       
  1162 		margin: 0;
       
  1163 		left: 0;
       
  1164 		overflow-y: auto;
       
  1165 	}
       
  1166 }
       
  1167 
       
  1168 /* Smartphone */
       
  1169 @media screen and (max-width: 600px) {
       
  1170 	/* Color Picker Options */
       
  1171 	.color-option {
       
  1172 		width: 49%;
       
  1173 	}
       
  1174 }
       
  1175