PluginProbe
Topic SEO Content Optimization Tool / trunk
Topic SEO Content Optimization Tool vtrunk
1.0.43 1.0.42 trunk 1.0.0 1.0.1 1.0.10 1.0.11 1.0.12 1.0.13 1.0.14 1.0.15 1.0.16 1.0.17 1.0.18 1.0.19 1.0.2 1.0.20 1.0.21 1.0.22 1.0.23 1.0.24 1.0.25 1.0.3 1.0.31 1.0.32 All 40 releases
topic / classic-editor / classic.css

classic.css in Topic SEO Content Optimization Tool trunk, at classic-editor/classic.css

1,841 lines 43.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Font Starts */
2 /*@font-face
3 {
4 font-family: Graphik;
5 font-style: normal;
6 font-weight: 500;
7 src: url('./fonts/Graphik500.ttf') format('ttf'),
8 url('./fonts/Graphik500.woff') format('woff'),
9 url('./fonts/Graphik500.otf') format('otf');
10 }*/
11 @font-face
12 {
13 font-family: Times;
14 font-style: normal;
15 font-weight: Regular;
16 src:url('./fonts/Times.woff') format('woff'),
17 }
18 @font-face
19 {
20 font-family: Verdana;
21 font-style: normal;
22 font-weight: 500;
23 src: url('./fonts/Verdana.woff') format('woff'),
24 }
25
26 /* Font Ends */
27 body h1, body h2, body h3, body h4, body h5, body h6
28 {
29 font-weight: 500;
30 }
31 #usetopicData strong
32 {
33 font-weight: 500;
34 }
35 #usetopicData {
36 position: fixed;
37 right: 0;
38 width: 372px;
39 top: 0;
40 background: #fff;
41 padding: 32px 0 0px 0;
42 min-height: auto;
43 overflow-y: scroll;
44 height: 98vh;
45 z-index: 9999;
46 display:none;
47 border-left: 1px solid #dedede;
48 overflow-x: hidden;
49 }
50 .usetopicDataShow{
51 display:block!important;
52 }
53 #usetopicData .closeTopicdata{
54 display: flex;
55 justify-content: space-between;
56 align-items: center;
57 padding: 0 16px;
58 height: 48px;
59 border-top: 1px solid #ddd;
60 border-bottom: 1px solid #ddd;
61 width: 100%;
62 background: #fff;
63 position: sticky;
64 top: 0;
65 z-index: 9999;
66 }
67 #usetopicData .closeTopicdata strong {
68 font-size: 0.875rem;
69 font-weight: 500;
70 color: #1e1e1e;
71 }
72
73 #usetopicData .closeTopicdata .close {
74 background: transparent;
75 box-shadow: 0 0 0 0 #fff;
76 border: 0;
77 padding: 0px 13px;
78 cursor:pointer;
79 position: relative;
80 margin-right: 13px;
81 }
82 #usetopicData .closeTopicdata .close .usetopic-tooltip
83 {
84 width: 65px !important;
85 left: -14%;
86 bottom: -30px;
87 }
88 #usetopicData .closeTopicdata .close:hover .usetopic-tooltip
89 {
90 opacity: 1;
91 }
92 #usetopicData .closeTopicdata .close .usetopic-tooltip:after
93 {
94 display: none;
95 }
96
97 #usetopicData .content
98 {
99
100 width: 105%;
101 }
102 #usetopicData .use-topic-top-bar
103 {
104 position: sticky;
105 bottom: 1rem;
106 z-index: 999;
107 background-color: rgb(249, 249, 250);
108 display: flex;
109 padding: 8px 6px 11px;
110 }
111 #usetopicData .use-topic-top-bar p
112 {
113 width: 87%;
114 margin: 0;
115 }
116 #usetopicData .use-topic-top-bar p a
117 {
118 font-size: 19px;
119 text-transform: lowercase;
120 color: #3f4b5b;
121 margin-left: 8px;
122 }
123 #usetopicData .usetopicbriefs .use-topic-top-bar.bottom-briefs-bar p a
124 {
125 margin-left: 19px;
126 }
127 #usetopicData .usetopicbriefs .use-topic-top-bar.bottom-briefs-bar span a
128 {
129 margin-left: 6px;
130 }
131 #usetopicData .use-topic-top-bar span a
132 {
133 font-size: 12px;
134 margin-top: 5px;
135 display: table;
136 }
137
138 #usetopicloginform h5 {
139 text-align: center;
140 font-size: 16px;
141 margin: 10px 0;
142 }
143
144 #usetopicloginform label, #usetopicData #usetopicgetBrieffm label
145 {
146 width: 100%;
147 display: block;
148 font-size: 14px;
149 font-weight: 200;
150 margin: 14px 0 2px;
151 }
152 #usetopicloginform label b, #usetopicData #usetopicgetBrieffm label b
153 {
154 width: 100%;
155 font-size: 12px;
156 font-weight: 300;
157 padding-bottom: 6px;
158 color: #666;
159 }
160 #usetopicloginform input, #usetopicData #usetopicgetBrieffm input
161 {
162 border: none;
163 margin: 0;
164 padding: 5px 10px;
165 box-shadow: 0px 1px 6px #7784945e;
166 width: 100%;
167 font-size: 16px;
168 border-radius: 4px 4px 0 0;
169 animation-name: mui-auto-fill-cancel;
170 letter-spacing: inherit;
171 animation-duration: 10ms;
172 -webkit-tap-highlight-color: transparent;
173 }
174 #usetopicloginform .utopicemail, #usetopicloginform .utopicpass, #usetopicData #usetopicgetBrieffm .lbrief-url
175 {
176 position: relative;
177 height: 48px;
178 }
179 #usetopicloginform .utopicemail:before, #usetopicloginform .utopicpass:before, #usetopicData #usetopicgetBrieffm .lbrief-url:before
180 {
181 left: 0;
182 right: 0;
183 bottom: 6px;
184 content: "\00a0";
185 position: absolute;
186 transition: border-bottom-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
187 border-bottom: 1px solid rgba(0, 0, 0, 0.42);
188 pointer-events: none;
189 }
190 #usetopicloginform .utopicemail:hover::before, #usetopicloginform .utopicpass:hover::before, #usetopicData #usetopicgetBrieffm .lbrief-url:hover::before
191 {
192 border-bottom: 1px solid rgba(0, 0, 0, 0.87);
193 }
194 #usetopicloginform input::placeholder, #usetopicData #usetopicgetBrieffm input::placeholder
195 {
196 color: #ccc;
197 }
198
199 input, select {
200 margin: 0 1px;
201 margin-bottom: 0px;
202 }
203 input, textarea {
204 font-size: 14px;
205 }
206 button, input, select, textarea {
207 box-sizing: border-box;
208 font-family: inherit;
209 font-size: inherit;
210 font-weight: inherit;
211 }
212 body {
213 color: #3c434a;
214 font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
215 font-size: 13px;
216 line-height: 1.4em;
217 }
218 .sign-in-right button, #usetopicData #usetopicgetBrieffm #usetopic-leadb-btn
219 {
220 color: #fff;
221 background-color: #3f4b5b;
222 border: 1px solid #3f4b5b;
223 padding: 4px 10px;
224 box-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 1px 5px 0px rgba(0,0,0,0.12);
225 font-size: 0.8125rem;
226 min-width: 64px;
227 box-sizing: border-box;
228 transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
229 font-family: Times, Arial;
230 font-weight: 500;
231 line-height: 1.75;
232 border-radius: 4px;
233 text-transform: uppercase;
234 width: auto;
235 cursor: pointer;
236 margin: 12px auto 0;
237 }
238 .sign-in-right button:hover {
239 box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12);
240 }
241 #usetopicData #usetopicgetBrieffm
242 {
243 text-align: center;
244 }
245 #usetopicData #usetopicloginform, #usetopicData #usetopicgetBrieffm
246 {
247 width: 58%;
248 margin: 25% auto 0;
249 position: relative;
250 }
251 #usetopicData #usetopicloginform h5, #usetopicData #usetopicgetBrieffm h5
252 {
253 font-size: 1.25rem;
254 font-family: Times, Arial;
255 font-weight: 500;
256 line-height: 1.6;
257 color: #3f4b5b;
258 }
259 .sign-in-right {
260 text-align: center;
261 }
262 #usetopicloginform input:hover, #usetopicData #usetopicgetBrieffm input:hover
263 {
264 border-bottom: 1px solid #000 !important;
265
266 }
267 #publishing-action-use-topic #usetopicMain
268 {
269 color: #fff;
270 background-color: #6b65ff;
271 border: 1px solid #6b65ff;
272 padding: 8px 10px;
273 box-shadow: 0px 3px 1px -2px
274 rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 1px 5px 0px
275 rgba(0,0,0,0.12);
276 font-size: 15px;
277 transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
278 font-family: Times, Arial;
279 font-weight: 500;
280 border-radius: 4px;
281 display: table;
282 margin: 10px 0 0 auto;
283 cursor: pointer;
284 }
285 #publishing-action-use-topic #usetopicMain:hover
286 {
287 box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12);
288 }
289
290 #major-publishing-actions-use-topic p {
291 float: left;
292 margin: 4px 0;
293 font-weight: 500;
294 }
295 #major-publishing-actions-use-topic{
296 padding: 10px;
297 clear: both;
298 border-top: 1px solid #dcdcde;
299 background: #f6f7f7;
300 display: flex;
301 }
302 #major-publishing-actions-use-topic p {
303 width: 50%;
304 }
305 #major-publishing-actions-use-topic #publishing-action-use-topic
306 {
307 width: 50%;
308 }
309 .use-topic-top-bar p {
310 color: #000;
311 text-decoration: none !important;
312 float: left;
313 width: 80%;
314 font-size: 15px;
315 font-weight: 300;
316 margin: 11px 0;
317 }
318
319 .use-topic-top-bar a {
320 text-decoration: none;
321 }
322 .use-topic-top-bar svg {
323 position: relative;
324 top: 5px;
325 }
326 .usetopic-login-Error{
327 display: none;
328 transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
329 background: rgb(44, 52, 63);
330 padding: 8px;
331 color: #fff;
332 font-weight: 500;
333 border-radius: 4px;
334 text-align: center;
335 }
336 .loadingusetopic
337 {
338 padding: 0;
339 }
340 .loadingusetopic::before
341 {
342 content: "";
343 position: fixed;
344 background: #f9f9f9;
345 height: 100%;
346 width: 100%;
347 animation: crescendo 1.5s alternate infinite ease-in;
348 z-index: 9999;
349 }
350 .loadingusetopic::after {
351 content: "Loading...";
352 position: absolute;
353 top: 50%;
354 left: 50%;
355 transform: translate(-50%,-50%);
356 color: rgb(51, 65, 82);
357 font-size: 17px;
358 z-index: 9999;
359 }
360 .usetopicbriefs .sign-in .usetopic_logout
361 {
362 width: 22%;
363 position: relative;
364 }
365 .usetopicbriefs .sign-in .usetopic_logout button
366 {
367 background: transparent;
368 border: none;
369 display: table;
370 margin-left: auto;
371 margin-top: 21px;
372 width: 41px;
373 height: 39px;
374 overflow: visible;
375 font-size: 1.5rem;
376 text-align: center;
377 transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
378 border-radius: 50%;
379 padding: 8px;
380 }
381 .usetopicbriefs .sign-in .usetopic_logout button:hover
382 {
383 background-color: rgba(0, 0, 0, 0.04);
384 }
385 .usetopicbriefs .sign-in p {
386 color: rgb(133, 159, 189);
387 font-size: 14px;
388 text-align: left;
389 width: 78%;
390 margin: 0;
391 word-break: break-word;
392 padding: 0.7rem 0rem;
393 }
394 .usetopicbriefs .sign-in {
395 display: flex;
396 }
397 .usetopicbriefs .sign-in .MuiSvgIcon-root.MuiSvgIcon-colorPrimary {
398 width: 23px;
399 color: rgb(133, 159, 189) !important;
400 cursor: pointer;
401 }
402 .usetopicbriefs .sign-in path {
403 fill: rgb(133, 159, 189);
404 }
405 .usetopicbriefs h3 {
406 color: #3f4b5b;
407 font-size: 1.25rem;
408 }
409 .search-usetopic .MuiSvgIcon-root.MuiSvgIcon-colorPrimary {
410 position: absolute !important;
411 width: 23px;
412 padding: 10px 0;
413 top: auto !important;
414 left: 36px;
415 color: #3f4b5b;
416 }
417 .usetopicbriefs .search-usetopic path {
418 fill: #3f4b5b;
419 }
420 .usetopicbriefs .search-usetopic input {
421 border-radius: 50px !important;
422 padding: 0.4rem 2rem 0.3rem 38px;
423 box-shadow: 0px 2px 5px 0px #3838382e;
424 border: 0 !important;
425 width: 100%;
426 font-size: 14px;
427 }
428 .usetopicbriefs .kyword-create th {
429 text-align: left;
430 color: #3f4b5b;
431 font-weight: 400;
432 }
433 .usetopicbriefs .kyword-create {
434 float: left;
435 width: 100%;
436 border-collapse: separate;
437 border-spacing: 0 14px;
438 padding-bottom: 69px;
439 }
440 .usetopicbriefs .usetopic_ycb
441 {
442 margin: 45px 4px -5px;
443 }
444 .usetopicbriefs .kyword-create tbody .usetopic-brief-tr
445 {
446 background: #fff;
447 }
448 .usetopicbriefs .kyword-create thead tr
449 {
450 box-shadow: none;
451 height: 35px;
452 cursor: auto;
453 }
454 .usetopicbriefs .kyword-create thead tr th
455 {
456 color: #3f4b5b;
457 font-size: 14px;
458 }
459 .usetopicbriefs .kyword-create tr
460 {
461 box-shadow: 0px 2px 5px 0px #3838382e;
462 border-collapse: separate;
463 border-spacing: 0 15px;
464 height: 43px;
465 cursor: pointer;
466 }
467 .usetopicbriefs .kyword-create tr td:first-child, .usetopicbriefs .kyword-create tr th:first-child
468 {
469 font-size: 14px;
470 color: #3f4b5b;
471 width: 70%;
472 padding-left: 13px;
473 }
474 .usetopicbriefs .kyword-create tr td, .usetopicbriefs .kyword-create tr th
475 {
476 color: grey;
477 font-weight: 400;
478 }
479 @keyframes crescendo {
480 /* 0% {background: #424242;}
481 100% {background: #737373;} */
482 0% {background: #fbfbfb;}
483 100% {background: #f5f5f5;}
484 }
485
486 .brief-detail-header .usetopic_logout
487 {
488 width: 22%;
489 }
490 .brief-detail-header .usetopic_logout button
491 {
492 background: transparent;
493 border: none;
494 border-radius: 50%;
495 display: table;
496 margin-left: auto;
497 margin-top: 21px;
498 width: 40px;
499 height: 37px;
500 padding-top: 4px;
501 }
502 .brief-detail-header .usetopic_logout button:hover
503 {
504 background-color: rgba(0, 0, 0, 0.04);
505 }
506 .brief-detail-header p {
507 color: rgb(133, 159, 189);
508 font-size: 14px;
509 text-align: left;
510 width: 78%;
511 word-break: break-all;
512 }
513 .brief-detail-header {
514 display: flex;
515 }
516 .brief-detail-header .MuiSvgIcon-root.MuiSvgIcon-colorPrimary {
517 width: 23px;
518 color: rgb(113, 113, 113) !important;
519 cursor: pointer;
520 }
521 .brief-detail-header path {
522 fill: rgb(133, 159, 189);
523 }
524 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab {
525 overflow: hidden;
526 border: none;
527 background-color: transparent;
528 }
529 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab ul
530 {
531 display: flex;
532 justify-content: center;
533 margin: 0;
534 }
535 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab ul li
536 {
537 margin-bottom: 0;
538 }
539 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button {
540 background-color: inherit;
541 float: left;
542 border: none;
543 outline: none;
544 cursor: pointer;
545 padding: 11px;
546 font-size: 0.875rem;
547 width: 100px;
548 box-shadow: none;
549 height: auto;
550 min-height: auto;
551 line-height: 100%;
552 color: #000;
553 border-radius: 0;
554 }
555 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button.active, .usetopic-briefdetail .usetopic-tqo .tab button.active:hover
556 {
557 background-color: #fff;
558 color: #000;
559 border-color: transparent;
560 box-shadow: none;
561 }
562 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button:focus
563 {
564 background: #fff;
565 }
566 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button:hover
567 {
568 background-color: #dcdcde;
569 color: #000;
570 border-color: transparent;
571 box-shadow: none;
572 background: rgba(0, 0, 0, 0.05);
573 background-color: rgba(0, 0, 0, 0.05);
574 }
575
576 /* Change background color of buttons on hover */
577 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button:hover {
578 background-color: rgba(0, 0, 0, 0.05);
579 }
580
581 /* Create an active/current tablink class */
582 #usetopicData .usetopic-briefdetail .usetopic-tqo .tab button.active {
583 background-color: #fff;
584 font-weight: 500;
585 }
586
587 /* Style the tab content */
588 #usetopicData .usetopic-briefdetail .usetopic-tqo .tabcontent {
589 padding: 1px 35px 1px 15px;
590 background: #fff;
591 }
592 #usetopicData .usetopic-briefdetail .usetopic-tqo .tabcontent h3
593 {
594 font-size: 1.25rem;
595 }
596 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li
597 {
598 display: flex;
599 padding: 0.3rem 0;
600 cursor: pointer;
601 margin-top: 0.3rem;
602 margin-bottom: 0.3rem;
603 }
604 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-brief-ct-name
605 {
606 font-weight: 500;
607 color: rgb(62, 75, 91);
608 width: 78%;
609 font-size: 1rem;
610 position: relative;
611 }
612 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-brief-ct-name p
613 {
614 color: grey;
615 font-size: 0.75rem;
616 margin: 4px 0 0;
617 font-weight: 400;
618 }
619 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used
620 {
621 padding: 10px 16px 0;
622 border-radius: 50%;
623 position: relative;
624 line-height: 100%;
625 }
626 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used:hover
627 {
628 background: rgba(0, 0, 0, 0.04);
629 }
630 #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopicquestions h3, #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopicoutlines h3
631 {
632 font-weight: 500;
633 color: rgb(51, 65, 82);
634 font-size: 0.875rem;
635 }
636 #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopicquestions .intro, #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopicoutlines .intro
637 {
638 color: rgb(51, 65, 82);
639 font-size: 0.75rem;
640 }
641 #wpcontent #wpbody #wpbody-content .usetopic-lesswidth
642 {
643 width: 90%;
644 }
645
646 #wpcontent #wpbody #wpbody-content .notice.usetopic-lesswidth{
647 width: 61%;
648 }
649
650 #wpcontent .usetopic-lesswidth{
651 width: 90%;
652 }
653 #wpwrap .usetopicDataShow
654 {
655 font-family: Times, Arial !important;
656 }
657 #usetopicData .usetopic-briefdetail .usetopic-alreadyAdded
658 {
659 background-color: rgb(213, 233, 214);
660 margin: 0 -16px !important;
661 padding-left: 16px !important;
662 padding-right: 16px !important;
663 padding-top: 0.5rem !important;
664 padding-bottom: 0.5rem !important;
665 margin-top: 0 !important;
666 margin-bottom: 0 !important;
667 }
668 .usetopicDataShow .usetopicbriefs
669 {
670 background: #f9f9f9;
671 padding: 0 39px 0 23px;
672 }
673 .usedTopicsAllTopics li svg {
674 height: 20px;
675 color: rgba(0, 0, 0, 0.54);
676 width: 1em;
677 }
678 #usetopicData
679 {
680 background: #f9f9f9;
681 }
682 #usetopicData .use-topic-top-bar.bottom-briefs-bar
683 {
684 border-top-color: rgb(234, 234, 233);
685 border-top-style: solid;
686 margin: 0;
687 position: fixed;
688 bottom: 0;
689 width: 28%;
690 }
691 #usetopicData .usetopicbriefs .use-topic-top-bar.bottom-briefs-bar
692 {
693 margin: 0 -24px;
694 }
695 .usetopicDataShow .usetopic-briefdetail
696 {
697 background: #f9f9f9;
698 }
699 .usetopicDataShow .usetopic-briefdetail .brief-detail-header
700 {
701 display: flex;
702 justify-content: center;
703 }
704 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout
705 {
706 width: 25%;
707 margin: 1px 0 0;
708 position: relative;
709 }
710 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back .MuiSvgIcon-root, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout .usetopic_logout_btn
711 {
712 color: rgb(133, 159, 189);
713 overflow: visible;
714 font-size: 1.5rem;
715 text-align: center;
716 transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
717 border-radius: 50%;
718 margin: 0 auto;
719 display: table;
720 padding: 8px;
721 }
722 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back .MuiSvgIcon-root:hover, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout .usetopic_logout_btn:hover
723 {
724 background-color: rgba(0, 0, 0, 0.04);
725 }
726 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout .usetopic_logout_btn
727 {
728 margin: 0 auto;
729 }
730 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .title
731 {
732 width: 50%;
733 padding: 0.7rem 0rem;
734 font-size: 12px;
735 font-weight: 500;
736 color: rgb(156, 162, 170);
737 text-align: center;
738 }
739 #usetopicData .usetopic-briefdetail .grading
740 {
741 text-align: center;
742 margin-bottom: 21px;
743 }
744 #usetopicData .usetopic-briefdetail .grading p
745 {
746 font-weight: 500;
747 color: rgb(51, 65, 82);
748 font-size: 0.75rem;
749 text-align: center;
750 }
751 #usetopicData .usetopic-briefdetail .grading h3
752 {
753 font-weight: 500;
754 color: rgb(62, 75, 92);
755 margin-bottom: 0.35em;
756 font-size: 2.125rem;
757 margin-top: 0;
758 }
759 #usetopicData .usetopic-briefdetail .grading .usetopic-bdwc
760 {
761 color: rgb(51, 65, 82);
762 font-size: 0.875rem;
763 font-weight: 500;
764 }
765 #usetopicData .usetopic-briefdetail .grading .usetopic-bdwc #usetopic-wordcount
766 {
767 color: #fff;
768 background: rgb(255, 76, 76);
769 opacity: 0.5;
770 height: auto;
771 font-size: 0.8125rem;
772 transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
773 width: auto;
774 display: inline-table;
775 border-radius: 50%;
776 padding: 6px 10px;
777 }
778
779 #usetopicData .usetopic-briefdetail .usetopic-tqo .usetopic-tb {
780 background-color: #91A1A4;
781 color: #ecf0f1;
782 box-shadow: 2px 2px 5px #809093;
783 /* box-shadow: 10px 10px 5px #809093; */
784 height: 50px;
785 width: 300px;
786 font-size: 30px;
787 border-radius: 5px;
788 outline: none;
789 border: 0;
790 overflow: hidden;
791 position: relative;
792 cursor: pointer;
793 }
794 #usetopicData .usetopic-briefdetail .usetopic-tqo .usetopic-tb:hover {
795 opacity: 0.9;
796 }
797
798 #usetopicData .usetopic-briefdetail .usetopic-tqo .hold-mouse {
799 box-shadow: 4px 4px 55px #809093;
800 }
801
802 #usetopicData .usetopic-briefdetail .usetopic-tqo .circle {
803 height: 25px;
804 width: 25px;
805 background-color: rgba(255, 255, 255, 0.3);
806 border-radius: 50%;
807 position: absolute;
808 left: 50%;
809 top: 50%;
810 pointer-events: none;
811 transform: scale(0);
812 /* animation: grow 1s forwards; */
813 }
814
815 @keyframes grow {
816 0% {
817 background-color: rgba(50, 50, 50, 0.5);
818 transform: scale(1);
819 z-index: 2;
820 }
821 100% {
822 background-color: rgba(50, 50, 50, 0.3);
823 transform: scale(30);
824 opacity: 0;
825 z-index: -1;
826 }
827 }
828 #usetopicData .usetopic-briefdetail .usetopic-tqo .grow {
829 animation: grow 1.4s ease-out forwards;
830 }
831 #usetopicData .acc
832 {
833 margin: 0 auto;
834 }
835 #usetopicData .acc__card
836 {
837 position: relative;
838 border-top: 1px solid rgba(0, 0, 0, 0.12);
839 }
840 #usetopicData .acc__title
841 {
842 background: transparent;
843 box-shadow: none;
844 color: rgb(51, 65, 82);
845 cursor: pointer;
846 display: block;
847 padding: 12px 0;
848 position: relative;
849 text-align: left;
850 font-weight: 500;
851 }
852 #usetopicData .acc__title::after {
853 width: 8px;
854 height: 8px;
855 border-right: 2px solid #4a6e78;
856 border-bottom: 2px solid #4a6e78;
857 position: absolute;
858 right: 10px;
859 content: " ";
860 top: 17px;
861 transform: rotate(42deg);
862 transition: all 0.2s ease-in-out;
863 }
864 #usetopicData .acc__title.active::after {
865 transform: rotate(-137deg);
866 transition: all 0.2s ease-in-out;
867 }
868
869 #usetopicData .acc__panel {
870 background: #fff;
871 color: #212121;
872 display: none;
873 margin: 0;
874 padding: 0 0 22px;
875 text-align: left;
876 }
877 #usetopicData .usetopic-related-questions li
878 {
879 padding: 16px 0;
880 border-bottom: 1px solid rgba(0, 0, 0, 0.12);
881 display: flex;
882 flex-wrap: wrap;
883 }
884 #usetopicData .usetopic-related-questions .usetopic-qa
885 {
886 font-size: 12px;
887 color: rgb(62, 75, 91);
888 text-decoration: none;
889 width: 100%;
890 display: block;
891 padding-right: 23px;
892 }
893 #usetopicData .usetopic-related-questions .usetopic-qa-icon
894 {
895 display: table;
896 margin: -15px 12px 0 auto;
897 }
898 #usetopicData .usetopic-related-questions svg
899 {
900 width: 1em;
901 color: rgba(0, 0, 0, 0.54);
902 margin-top: 3px;
903 margin-left: auto;
904 }
905 #usetopicData .usetopic-related-questions.usetopic-gsuggs .usetopic-qa-icon
906 {
907 margin: -20px 12px 0 auto;
908 }
909 #usetopicData .usetopic-single-outline
910 {
911 box-shadow: 0px 2px 5px 0px #3838382e;
912 border-radius: 4px;
913 color: rgba(0, 0, 0, 0.87);
914 transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
915 background-color: #fff;
916 margin-bottom: 20px;
917 }
918 #usetopicData .usetopic-single-outline .uto-header
919 {
920 background-color: rgb(242, 244, 248);
921 padding: 16px;
922 font-size: 0.75rem;
923 }
924 #usetopicData .usetopic-single-outline .uto-body
925 {
926 padding: 16px;
927 }
928 #usetopicData .usetopic-single-outline .uto-body>h3
929 {
930 margin-bottom: 0;
931 }
932 #usetopicData .usetopic-single-outline .uto-body h3
933 {
934 color: rgb(62, 75, 91);
935 font-weight: 500;
936 margin-top: 0.5rem;
937 }
938 #usetopicData .usetopic-single-outline .uto-body h3 img
939 {
940 margin-right: 0.2rem;
941 width: 14px;
942 }
943 #usetopicData .usetopic-single-outline .uto-body h4
944 {
945 font-weight: 500;
946 color: rgb(133, 159, 189);
947 font-size: 0.875rem;
948 }
949 #usetopicData .usetopic-single-outline .uto-body p
950 {
951 font-size: 0.75rem;
952 font-weight: 400;
953 line-height: 1.66;
954 }
955 #usetopicData .usetopic-single-outline .uto-body li p
956 {
957 margin: 10px 0;
958 }
959 #usetopicData .usetopic-single-outline #usetopicoutlines .uto-body h4
960 {
961 margin: 18px 0 0;
962 }
963 #usetopicData .usetopic-single-outline .uto-body ul .H2, #usetopicData .usetopic-single-outline .uto-body ul .H1
964 {
965 font-weight: 500;
966 color: rgb(62, 75, 91);
967 font-size: 0.875rem;
968 line-height: 1.57;
969 margin-bottom: 0;
970 }
971 #usetopicData .usetopic-single-outline .uto-body ul li
972 {
973 margin-top: 12px;
974 }
975 #usetopicData .usetopic-single-outline .uto-body ul .H3, #usetopicData .usetopic-single-outline .uto-body ul .H4
976 {
977 color: rgb(62, 75, 91);
978 margin-left: 1rem;
979 font-size: 0.875rem;
980 line-height: 1.43;
981 margin-bottom: 0;
982 }
983 #usetopicData #usetopicoutlines
984 {
985 padding-bottom: 28px;
986 }
987
988 /* progress bar */
989 #usetopicData .usetopic-progress
990 {
991 background-color: #d9d9d9;
992 height: 18px;
993 width: 66%;
994 border-radius: 10px;
995 overflow: hidden;
996 margin: 25px auto 8px;
997 }
998 #usetopicData .progress-bar__inner
999 {
1000 position: relative;
1001 display: block;
1002 height: 100%;
1003 background-color: #fc6f4a;
1004 animation: run-progress 1s;
1005 border-radius: 8px;
1006 }
1007 @keyframes run-progress {
1008 0% {
1009 width: 0;
1010 }
1011 }
1012
1013 #usetopicData .usetopic-briefdetail .usetopic-tqo
1014 {
1015 padding-bottom: 69px;
1016 }
1017 .usetopicDataShow .usetopic-tooltip
1018 {
1019 background: #3f4b5b;
1020 color: #fff !important;
1021 width: 38px !important;
1022 padding: 3px 7px !important;
1023 font-size: 11px !important;
1024 border-radius: 4px;
1025 transition: 0.4s ease;
1026 opacity: 0;
1027 position: absolute;
1028 left: 50%;
1029 transform: translate(-50%,0);
1030 bottom: -41px;
1031 z-index: 2;
1032 }
1033 .usetopicDataShow .usetopic-tooltip:after
1034 {
1035 background: #3f4b5b;
1036 position: absolute;
1037 width: 7px;
1038 height: 7px;
1039 top: -4px;
1040 left: 50%;
1041 transform: translate(-50%,0) rotate(45deg);
1042 content: "";
1043 opacity: 1;
1044 transition: 0.4s ease;
1045 z-index: 2;
1046 }
1047 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-tooltip
1048 {
1049 width: 120px !important;
1050 background: #707070;
1051 }
1052 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-tooltip:after
1053 {
1054 background: #707070;
1055 }
1056 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back svg:hover + .usetopic-tooltip, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back svg:hover + .usetopic-tooltip:after
1057 {
1058 opacity: 1;
1059 }
1060 .usetopicbriefs .sign-in .usetopic_logout button:hover .usetopic-tooltip, .usetopicbriefs .sign-in .usetopic_logout button:hover .usetopic-tooltip:after, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout .usetopic_logout_btn:hover .usetopic-tooltip, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout .usetopic_logout_btn:hover .usetopic-tooltip:after
1061 {
1062 opacity: 1;
1063 }
1064 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-brief-ct-name:hover .usetopic-tooltip, #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-brief-ct-name:hover .usetopic-tooltip:after, #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used svg:hover .usetopic-tooltip, #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used svg:hover .usetopic-tooltip:after
1065 {
1066 opacity: 1;
1067 }
1068 #usetopictopics .usetopic_switch
1069 {
1070 margin: 22px 0 26px;
1071 }
1072 #usetopictopics .usetopic_switch input[type="checkbox"]
1073 {
1074 position: relative;
1075 width: 40px;
1076 height: 14px;
1077 -webkit-appearance: none;
1078 background: #a2a8af;
1079 border-radius: 100px;
1080 outline: none;
1081 border: none;
1082 transition: 0.2s ease;
1083 }
1084 #usetopictopics .usetopic_switch input:focus
1085 {
1086 box-shadow: none;
1087 }
1088 #usetopictopics .usetopic_switch input:checked[type="checkbox"]::before
1089 {
1090 background: #3f4b5a;
1091 }
1092 #usetopictopics .usetopic_switch input[type="checkbox"]::before
1093 {
1094 content: '';
1095 position: absolute;
1096 width: 18px;
1097 height: 18px;
1098 top: -3px;
1099 left: 0;
1100 background: #fff;
1101 border-radius: 50%;
1102 box-shadow: 0px 2px 1px -1px
1103 rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px
1104 rgba(0,0,0,0.12);
1105 transform: scale(1.1);
1106 transition: 0.2s ease;
1107 }
1108 #usetopictopics .usetopic_switch input:checked[type="checkbox"]::before
1109 {
1110 left: 50%;
1111 }
1112 .hide-used-topics .usetopic-alreadyAdded {
1113 display: none !important;
1114 }
1115 #usetopictopics .usetopic_switch input[type="checkbox"]:checked::before
1116 {
1117 margin: 0;
1118 }
1119 .usetopicDataShow .usetopic_logout .usetopic-tooltip
1120 {
1121 left: 69%;
1122 bottom: -32px;
1123 }
1124 .usetopicDataShow .usetopic-briefdetail .usetopic_logout .usetopic-tooltip
1125 {
1126 left: 50%;
1127 bottom: -41px;
1128 }
1129 .usetopicDataShow .usetopic_back .usetopic-tooltip
1130 {
1131 width: 25px !important;
1132 }
1133 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used:hover .usetopic-tooltip, #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used:hover .usetopic-tooltip:after
1134 {
1135 opacity: 1;
1136 }
1137 .usetopicDataShow .usetopic-brief-ct-name .usetopic-tooltip
1138 {
1139 background: #3f4b5b;
1140 bottom: -30px;
1141 }
1142 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used .usetopic-tooltip
1143 {
1144 width: 107px !important;
1145 bottom: -29px;
1146 background: #707070;
1147 margin: 0;
1148 }
1149 #usetopicData .usetopic-briefdetail .usetopic-tqo .usedTopicsAllTopics li .usetopic-headingsin-used .usetopic-tooltip:hover
1150 {
1151 background: #707070;
1152 }
1153 #usetopicData .usetopic-keyword-detail-popup
1154 {
1155 background: #fff;
1156 width: 34%;
1157 position: fixed;
1158 top: 0;
1159 bottom: 0;
1160 z-index: 9999999;
1161 padding: 35px 0.5rem 12px 0.5rem;
1162 right: 0;
1163 overflow: scroll;
1164 }
1165 #usetopicData .usetopic-keyword-detail-popup .ut-header
1166 {
1167 position: relative;
1168 text-align: center;
1169 min-height: 60px;
1170 }
1171 #usetopicData .usetopic-keyword-detail-popup .ut-header .usetopic-keyword-back
1172 {
1173 position: absolute;
1174 top: -11px;
1175 left: -8px;
1176 }
1177 #usetopicData .usetopic-keyword-detail-popup .ut-header .usetopic-keyword-back svg
1178 {
1179 color: #3f4b5b;
1180 width: 1em !important;
1181 height: 1em;
1182 display: inline-block;
1183 font-size: 1.5rem;
1184 transform: rotate(180deg);
1185 padding: 10px;
1186 border-radius: 50%;
1187 cursor: pointer;
1188 }
1189 #usetopicData .usetopic-keyword-detail-popup .ut-header .usetopic-keyword-back svg:hover
1190 {
1191 background: rgba(0, 0, 0, 0.04);
1192 }
1193 .usetopicDataShow .ut-header .usetopic-keyword-back svg:hover + .usetopic-tooltip, .usetopicDataShow .ut-header .usetopic-keyword-back svg:hover + .usetopic-tooltip:after
1194 {
1195 opacity: 1;
1196 }
1197 .usetopicDataShow .ut-header .usetopic-keyword-back .usetopic-tooltip
1198 {
1199 width: auto !important;
1200 }
1201 #usetopicData .usetopic-keyword-detail-popup .ut-header h3
1202 {
1203 color: rgb(62, 75, 91);
1204 font-weight: 500;
1205 margin: 0.5rem 2.5rem -6px;
1206 }
1207 #usetopicData .usetopic-keyword-detail-popup .ut-header p
1208 {
1209 color: grey;
1210 font-weight: 500;
1211 font-size: 0.75rem;
1212 }
1213 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-header2
1214 {
1215 border: 1px solid rgba(0, 0, 0, 0.12);
1216 border-left: none;
1217 border-right: none;
1218 display: flex;
1219 margin: 0 -0.5rem;
1220 padding: 9px 0 4px;
1221 }
1222 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-header2 li
1223 {
1224 list-style: none;
1225 width: calc(100% / 3);
1226 text-align: center;
1227 }
1228 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-header2 li p
1229 {
1230 font-size: 0.75rem;
1231 color: rgba(0, 0, 0, 0.87);
1232 margin: 0;
1233 }
1234 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-header2 li h4
1235 {
1236 color: rgb(62, 75, 91);
1237 font-style: italic;
1238 font-weight: 500;
1239 font-size: 0.875rem;
1240 margin: 3px 0 0;
1241 }
1242 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-headused
1243 {
1244 width: 91.666667%;
1245 }
1246 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-headused h2, #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-sources h2
1247 {
1248 color: rgb(63, 75, 91);
1249 font-weight: 500;
1250 margin-top: 1.5rem;
1251 font-size: 1.25rem;
1252 margin-bottom: 16px;
1253 }
1254 #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-headused .utk-headused-single h3, #usetopicData .usetopic-keyword-detail-popup .usetopic-keyword-sources .utk-sources-single h3
1255 {
1256 color: rgb(62, 75, 91);
1257 font-weight: 500;
1258 margin-top: 0;
1259 font-size: 1rem;
1260 line-height: 1.4em;
1261 margin-bottom: 2px;
1262 }
1263 #usetopicData .usetopic-keyword-detail-popup .utk-headused-single, #usetopicData .usetopic-keyword-sources .utk-sources-single
1264 {
1265 border-bottom: 1px solid rgba(0, 0, 0, 0.12);
1266 padding: 18px 0.5rem 5px 0.5rem;
1267 }
1268 #usetopicData .usetopic-keyword-detail-popup .utk-headused-single li, #usetopicData .usetopic-keyword-detail-popup .utk-sources-single .utks-desc li
1269 {
1270 color: rgba(0, 0, 0, 0.87);
1271 position: relative;
1272 font-size: 0.875rem;
1273 line-height: 1.43;
1274 padding: 0 1rem 0 1rem;
1275 }
1276 #usetopicData .usetopic-keyword-detail-popup .utk-headused-single li:before, #usetopicData .usetopic-keyword-detail-popup .utk-sources-single .utks-desc li:before
1277 {
1278 background: rgba(0, 0, 0, 0.87);
1279 content: "";
1280 height: 5px;
1281 width: 5px;
1282 border-radius: 50%;
1283 display: inline-table;
1284 margin-right: 12px;
1285 position: relative;
1286 top: -2px;
1287 }
1288
1289 .MuiDrawer-root.MuiDrawer-modal{
1290 z-index: 999999!important;
1291 }
1292
1293 .body-overlay-usetopic::before {
1294 content: " ";
1295 width: 100%;
1296 height: 100%;
1297 position: fixed;
1298 background: rgba(0, 0, 0, 0.5);
1299 z-index: 9999;
1300 }
1301 .body-overlay-usetopic{
1302 overflow: hidden;
1303 }
1304 .usetopic-login-toggle
1305 {
1306 display: table;
1307 margin: 49px auto 0;
1308 font-size: 0.875rem;
1309 position: relative;
1310 }
1311
1312 #usetopicData #usetopic-login-toggle:focus
1313 {
1314 color: #2271b1;
1315 box-shadow: none;
1316 outline: none;
1317 }
1318 #usetopicData #usetopic-login-toggle
1319 {
1320 margin: 62px auto 0;
1321 font-size: 0.875rem;
1322 display: table;
1323 position: relative;
1324 }
1325 #usetopicData #usetopic-login-toggle:after
1326 {
1327 position: absolute;
1328 content: "";
1329 top: -28px;
1330 left: 50%;
1331 transform: translate(-50%,0);
1332 background: #e8e8e8;
1333 width: 65px;
1334 height: 1px;
1335 }
1336 #usetopicData #usetopicloginform .usetopic-login-Error, #usetopicData #usetopicgetBrieffm .usetopic-loadbrief-Error
1337 {
1338 position: absolute;
1339 left: 50%;
1340 transform: translate(-50%,0);
1341 bottom: -69px;
1342 width: 100%;
1343 z-index: 1;
1344 font-size: 12px;
1345 }
1346 #usetopicData #usetopicgetBrieffm .usetopic-loadbrief-Error
1347 {
1348 transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
1349 background: rgb(44, 52, 63);
1350 padding: 8px;
1351 color: #fff;
1352 font-weight: 500;
1353 border-radius: 4px;
1354 display: none;
1355 text-align: center;
1356 }
1357 .loadingusetopicsearch
1358 {
1359 position: fixed;
1360 height: auto;
1361 width: 27%;
1362 z-index: 9999;
1363 color: #3f4b5b;
1364 padding: 91px 0;
1365 text-align: center;
1366 font-size: 17px;
1367 /*animation: crescendo 1.5s alternate infinite ease-in;*/
1368 }
1369 .usetopicbriefs .kyword-create .ro-results-usetopic
1370 {
1371 box-shadow: none;
1372 text-align: center;
1373 cursor: auto;
1374 position: relative;
1375 top: 10px;
1376 }
1377 .smallScreenContent
1378 {
1379 display: none;
1380 }
1381
1382 @media (max-width: 600px)
1383 {
1384 #usetopicData
1385 {
1386 padding-top: 3px !important;
1387 }
1388 }
1389 @media (max-width: 949px)
1390 {
1391 .smallScreenContent
1392 {
1393 display: block;
1394 position: absolute;
1395 top: 50%;
1396 left: 50%;
1397 transform: translate(-50%,-50%);
1398 color:
1399 rgb(51, 65, 82);
1400 font-size: 17px;
1401 z-index: 9999;
1402 width: 90%;
1403 text-align: center;
1404 line-height: 24px;
1405 }
1406 .usetopicDataShow .hidebig
1407 {
1408 display: none;
1409 }
1410 .usetopicDataShow .usetopicbriefs
1411 {
1412 padding: 0 50px 0 26px;
1413 }
1414 .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_back, .usetopicDataShow .usetopic-briefdetail .brief-detail-header .usetopic_logout
1415 {
1416 width: 20%;
1417 }
1418 #usetopicData
1419 {
1420 width: 100%;
1421 padding-top: 60px;
1422 }
1423 #usetopicData .usetopic-briefdetail .usetopic-tqo .tabcontent
1424 {
1425 padding: 1px 40px 1px 15px;
1426 }
1427 #usetopicData .usetopic-keyword-detail-popup
1428 {
1429 width: 100%;
1430 left: 0;
1431 }
1432 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1433 {
1434 width: 100%;
1435 }
1436 }
1437 @media (min-width: 950px) and (max-width: 960px)
1438 {
1439 #usetopicData
1440 {
1441 width: 395px;
1442 }
1443 #wpcontent #wpbody #wpbody-content .usetopic-lesswidth, #wpcontent .usetopic-lesswidth
1444 {
1445 width: 42%;
1446 }
1447 #wpcontent #wpbody #wpbody-content .notice.usetopic-lesswidth{
1448 width: 52%;
1449 }
1450 .usetopicDataShow .usetopicbriefs
1451 {
1452 padding: 0 2rem 0 1rem;
1453 }
1454 #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopictopics .usedTopicsAllTopics li .usetopic-tooltip
1455 {
1456 width: 122px !important;
1457 }
1458 #usetopicData .usetopicbriefs .use-topic-top-bar.bottom-briefs-bar
1459 {
1460 width: 40%;
1461 margin: 0 -15px;
1462 }
1463 }
1464 @media (min-width: 961px) and (max-width: 1023px)
1465 {
1466 #usetopicData
1467 {
1468 width: 328px;
1469 }
1470 .usetopicDataShow .usetopicbriefs
1471 {
1472 padding: 0 2rem 0 1rem;
1473 }
1474 #usetopicData .usetopic-briefdetail .usetopic-tqo #usetopictopics .usedTopicsAllTopics li .usetopic-tooltip
1475 {
1476 width: 122px !important;
1477 }
1478 #usetopicData .usetopicbriefs .use-topic-top-bar.bottom-briefs-bar
1479 {
1480 width: 31%;
1481 margin: 0 -15px;
1482 }
1483 @media not all and (min-resolution:.001dpcm)
1484 {
1485 @supports (-webkit-appearance:none)
1486 {
1487 #usetopicData .usetopic-keyword-detail-popup
1488 {
1489 width: 315px !important;
1490 }
1491 }
1492 }
1493 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1494 {
1495 @media
1496 {
1497 #usetopicData .usetopic-keyword-detail-popup
1498 {
1499 width: 315px !important;
1500 }
1501 }
1502 }
1503 }
1504 @media (min-width: 1024px) and (max-width: 1279px)
1505 {
1506 #usetopicData
1507 {
1508 /*width: 305px;*/
1509 }
1510 #wpcontent #wpbody #wpbody-content .usetopic-lesswidth, #wpcontent .usetopic-lesswidth
1511 {
1512 /*width: 100%;*/
1513 }
1514 #wpcontent #wpbody #wpbody-content .notice.usetopic-lesswidth{
1515 width: 59%;
1516 }
1517 .usetopicDataShow .usetopicbriefs
1518 {
1519 padding: 0 33px 0 16px;
1520 }
1521 @media not all and (min-resolution:.001dpcm)
1522 {
1523 @supports (-webkit-appearance:none)
1524 {
1525 #usetopicData .usetopic-keyword-detail-popup
1526 {
1527 width: 290px !important;
1528 }
1529 }
1530 }
1531 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1532 {
1533 @media
1534 {
1535 #usetopicData .usetopic-keyword-detail-popup
1536 {
1537 width: 290px !important;
1538 }
1539 }
1540 }
1541 }
1542 @media (min-width: 1437px) and (max-width: 1599px)
1543 {
1544 #usetopicData
1545 {
1546 width: 385px;
1547 }
1548 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1549 {
1550 width: 375px;
1551 }
1552 @media not all and (min-resolution:.001dpcm)
1553 {
1554 @supports (-webkit-appearance:none)
1555 {
1556 #usetopicData .usetopic-keyword-detail-popup
1557 {
1558 width: 370px !important;
1559 }
1560 }
1561 }
1562 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1563 {
1564 @media
1565 {
1566 #usetopicData .usetopic-keyword-detail-popup
1567 {
1568 width: 370px !important;
1569 }
1570 }
1571 }
1572 }
1573 @media (min-width: 1600px) and (max-width: 1844px)
1574 {
1575 #usetopicData
1576 {
1577 width: 402px;
1578 }
1579 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1580 {
1581 width: 390px;
1582 }
1583 @media not all and (min-resolution:.001dpcm)
1584 {
1585 @supports (-webkit-appearance:none)
1586 {
1587 #usetopicData .usetopic-keyword-detail-popup
1588 {
1589 width: 387px !important;
1590 }
1591 }
1592 }
1593 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1594 {
1595 @media
1596 {
1597 #usetopicData .usetopic-keyword-detail-popup
1598 {
1599 width: 387px !important;
1600 }
1601 }
1602 }
1603 }
1604 @media (min-width: 1844px) and (max-width: 2144px)
1605 {
1606 #usetopicData
1607 {
1608 width: 428px;
1609 }
1610 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1611 {
1612 width: 410px;
1613 }
1614 @media not all and (min-resolution:.001dpcm)
1615 {
1616 @supports (-webkit-appearance:none)
1617 {
1618 #usetopicData .usetopic-keyword-detail-popup
1619 {
1620 width: 415px !important;
1621 }
1622 }
1623 }
1624 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1625 {
1626 @media
1627 {
1628 #usetopicData .usetopic-keyword-detail-popup
1629 {
1630 width: 415px !important;
1631 }
1632 }
1633 }
1634 }
1635 @media (min-width: 2145px) and (max-width: 2573px)
1636 {
1637 #usetopicData
1638 {
1639 width: 452px;
1640 }
1641 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1642 {
1643 width: 435px;
1644 }
1645 @media not all and (min-resolution:.001dpcm)
1646 {
1647 @supports (-webkit-appearance:none)
1648 {
1649 #usetopicData .usetopic-keyword-detail-popup
1650 {
1651 width: 437px !important;
1652 }
1653 }
1654 }
1655 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1656 {
1657 @media
1658 {
1659 #usetopicData .usetopic-keyword-detail-popup
1660 {
1661 width: 437px !important;
1662 }
1663 }
1664 }
1665 }
1666 @media (min-width: 2574px) and (max-width: 3217px)
1667 {
1668 #usetopicData
1669 {
1670 width: 497px;
1671 }
1672 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1673 {
1674 width: 480px;
1675 }
1676 @media not all and (min-resolution:.001dpcm)
1677 {
1678 @supports (-webkit-appearance:none)
1679 {
1680 #usetopicData .usetopic-keyword-detail-popup
1681 {
1682 width: 480px !important;
1683 }
1684 }
1685 }
1686 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1687 {
1688 @media
1689 {
1690 #usetopicData .usetopic-keyword-detail-popup
1691 {
1692 width: 480px !important;
1693 }
1694 }
1695 }
1696 }
1697 @media (min-width: 3218px) and (max-width: 4289px)
1698 {
1699 #usetopicData
1700 {
1701 width: 565px;
1702 }
1703 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1704 {
1705 width: 550px;
1706 }
1707 @media not all and (min-resolution:.001dpcm)
1708 {
1709 @supports (-webkit-appearance:none)
1710 {
1711 #usetopicData .usetopic-keyword-detail-popup
1712 {
1713 width: 550px !important;
1714 }
1715 }
1716 }
1717 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1718 {
1719 @media
1720 {
1721 #usetopicData .usetopic-keyword-detail-popup
1722 {
1723 width: 550px !important;
1724 }
1725 }
1726 }
1727 }
1728 @media (min-width: 3852px) and (max-width: 4289px)
1729 {
1730 #usetopicData
1731 {
1732 width: 615px;
1733 }
1734 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1735 {
1736 width: 580px;
1737 }
1738 @media not all and (min-resolution:.001dpcm)
1739 {
1740 @supports (-webkit-appearance:none)
1741 {
1742 #usetopicData .usetopic-keyword-detail-popup
1743 {
1744 width: 600px !important;
1745 }
1746 }
1747 }
1748 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1749 {
1750 @media
1751 {
1752 #usetopicData .usetopic-keyword-detail-popup
1753 {
1754 width: 600px !important;
1755 }
1756 }
1757 }
1758 }
1759 @media (min-width: 4290px) and (max-width: 5135px)
1760 {
1761 #usetopicData
1762 {
1763 width: 665px;
1764 }
1765 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1766 {
1767 width: 650px;
1768 }
1769 @media not all and (min-resolution:.001dpcm)
1770 {
1771 @supports (-webkit-appearance:none)
1772 {
1773 #usetopicData .usetopic-keyword-detail-popup
1774 {
1775 width: 650px !important;
1776 }
1777 }
1778 }
1779 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1780 {
1781 @media
1782 {
1783 #usetopicData .usetopic-keyword-detail-popup
1784 {
1785 width: 650px !important;
1786 }
1787 }
1788 }
1789 }
1790 @media (min-width: 5136px)
1791 {
1792 #usetopicData
1793 {
1794 width: 754px;
1795 }
1796 #usetopicData .use-topic-top-bar.bottom-briefs-bar
1797 {
1798 width: 685px;
1799 }
1800 @media not all and (min-resolution:.001dpcm)
1801 {
1802 @supports (-webkit-appearance:none)
1803 {
1804 #usetopicData .usetopic-keyword-detail-popup
1805 {
1806 width: 738px !important;
1807 }
1808 }
1809 }
1810 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1811 {
1812 @media
1813 {
1814 #usetopicData .usetopic-keyword-detail-popup
1815 {
1816 width: 738px !important;
1817 }
1818 }
1819 }
1820 }
1821 @media not all and (min-resolution:.001dpcm) {
1822 @supports (-webkit-appearance:none)
1823 {
1824 #usetopicData .usetopic-keyword-detail-popup
1825 {
1826 width: 357px;
1827 transition: 0.3s ease;
1828 }
1829 }
1830 }
1831 @media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
1832 {
1833 @media
1834 {
1835 #usetopicData .usetopic-keyword-detail-popup
1836 {
1837 width: 357px;
1838 }
1839 }
1840 }
1841