Advertisement
ValerioLyndon

ShelterStyle Modified for NikoruWasOnly15

Mar 1st, 2021
1,361
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 39.06 KB | None | 0 0
  1. @\import "https://fonts.googleapis.com/css?family=Rancho";
  2. @\import "https://fonts.googleapis.com/css?family=Slabo+27px|PT+Sans+Narrow";
  3.  
  4.  
  5.  
  6. /*BANNER AVATAR
  7. */
  8. .cover-block::after {background-image: url(https://i.imgur.com/ngrPIDa.png);
  9. }
  10.  
  11.  
  12. /* BANNER QUOTE
  13. */
  14. .cover-block::before {
  15. content: "'Is that really the kind of world you want?! That kind of power!'";
  16. }
  17.  
  18.  
  19.  
  20.  
  21. /* BANNER BACKGROUND */
  22. .list-status-title:after {
  23. background-image: url(https://i.imgur.com/uP1ncdk.jpg);
  24. }
  25.  
  26.  
  27. /* WALLPAPER */
  28. body, body.ownlist
  29. {
  30. background-image: url(https://i.imgur.com/iJg0pmo.jpg);
  31. }
  32.  
  33.  
  34.  
  35. /* ANIME/MANGA CONTAINER SETTINGS */
  36.  
  37. .list-table > tbody:nth-of-type(2n+1) {
  38. background-color: rgba(0,0,0,.7) !important;
  39. }
  40.  
  41. .list-table > tbody:nth-of-type(2n) {
  42. background-color: rgba(0,0,0,.8) !important;
  43. }
  44.  
  45. .list-unit .list-status-title {
  46. background-color:rgba(0,0,0,.7) !important;
  47. }
  48.  
  49.  
  50. /* BANNER OPACITY */
  51. .list-unit .list-status-title {
  52. opacity: .9;}
  53.  
  54.  
  55.  
  56. /* OTHER CODES */
  57.  
  58.  
  59. /* Removing default cover (banner) image */
  60.  
  61. #cover-image{
  62. display: none;
  63. }
  64.  
  65.  
  66. .list-unit .list-status-title {
  67. position: relative;
  68. display: table-cell;
  69. background-color: transparent;
  70. width: 1000px;
  71. height:400px !important;
  72. /*background-color:rgba(127,127,127,1);*/
  73. background: transparent;
  74. }
  75.  
  76. /* picture at the bottom of your list
  77. ** please note that default is a seiren picture even if you delete the image url below(it's just a sample image which you need to replace).
  78. ** if you don't want this section, just delete the image url
  79. */
  80. .list-unit .loading-space {
  81. height:250px;
  82. width:1000px;
  83. background-image:url(http://i.imgur.com/oUcAp2Y.png);
  84. }
  85.  
  86.  
  87. #advanced-options {
  88. position: fixed;
  89. top: 24px;
  90. left: 0;
  91. right: 0;
  92. background-color: rgba(255,255,255,.9);
  93. display: none;
  94. width: 860px;
  95. margin: 0 auto;
  96. padding: 25px 0px 30px;
  97. -moz-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  98. -webkit-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  99. -o-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  100. -ms-box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  101. box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  102. color: #323232;
  103. text-align: left;
  104. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  105. z-index: 1101;
  106. border: none;
  107. background-image: url();
  108. background-repeat: no-repeat;
  109. background-size: cover;
  110. background-position: 50% 100%; }
  111.  
  112. #advanced-options .advanced-options-header {
  113. width: 750px;
  114. margin: 0px auto;
  115. padding-bottom: 4px;
  116. border-bottom: 1px solid #BEBEBE;
  117. font-size: 16px;
  118. color:rgba(0,0,0,.6) !important;
  119. }
  120.  
  121.  
  122. #advanced-options .advanced-options-header .description {
  123. font-size: 12px;
  124. font-weight: normal;
  125. margin-left: 8px;
  126. color:rgba(0,0,0,.6) !important;
  127. }
  128.  
  129. #advanced-options .sort-widget .widget-header, #advanced-options .filter-widget .widget-header, #advanced-options .filter-widget.aired-date .text, #advanced-options .filter-widget.published-date .text {
  130. color:rgba(0,0,0,.6) !important;
  131. }
  132.  
  133. #advanced-options select {
  134. -ms-appearance: none;
  135. -webkit-appearance: none;
  136. -moz-appearance: none;
  137. appearance: none;
  138. background-image: url(/img/pc/ownlist/icon_pulldown_triangle.png);
  139. background-repeat: no-repeat;
  140. background-position: center right;
  141. background-size: 18px 8px;
  142. background-color: #FFFFFF;
  143. display: inline-block;
  144. height: 25px;
  145. padding: 4px 20px 4px 4px;
  146. padding-right: 4px\0;
  147. border: #BEBEBE 1px solid;
  148. border-radius: 0px;
  149. font-size: 12px;
  150. }
  151. #advanced-options select::-ms-expand {
  152. display: none;
  153. }
  154.  
  155. #advanced-options select:disabled {
  156. background-image: url(/img/pc/ownlist/icon_pulldown_triangle_disable.png);
  157. color: #9B9B9B;
  158. }
  159.  
  160. #advanced-options input[type=text] {
  161. padding: 4px;
  162. border: #BEBEBE 1px solid;
  163. }
  164.  
  165. #advanced-options input:focus {
  166. outline: none;
  167. }
  168.  
  169.  
  170. /* sort */
  171. #advanced-options .sort-widget {
  172. margin: 0px auto;
  173. padding: 12px 0px 0px;
  174. width: 750px;
  175. }
  176. #advanced-options .sort-widget:last-of-type {
  177. padding-bottom: 45px;
  178. }
  179.  
  180. #advanced-options .sort-widget select {
  181. width: 172px;
  182. margin-right: 8px;
  183. }
  184.  
  185. #advanced-options .sort-widget input[type=radio] {
  186. display: none;
  187. }
  188. #advanced-options .sort-widget input[type=radio] + label {
  189. background-color: #FFFFFF;
  190. display: inline-block;
  191. width: 56px;
  192. padding: 5px 0px;
  193. border: #BEBEBE 1px solid;
  194. border-radius: 4px;
  195. color: #323232;
  196. font-size: 12px;
  197. text-align: center;
  198. cursor: pointer;
  199. }
  200. #advanced-options .sort-widget input[type=radio]:checked + label {
  201. background-color: #244291;
  202. border: #244291 1px solid;
  203. color: #FFFFFF;
  204. }
  205. #advanced-options .sort-widget input[type=radio]:disabled + label {
  206. border: #BEBEBE 1px solid;
  207. color: #9B9B9B;
  208. }
  209. #advanced-options .sort-widget input[type=radio]:checked:disabled + label {
  210. background-color: #FFFFFF;
  211. border: #BEBEBE 1px solid;
  212. color: #9B9B9B;
  213. }
  214.  
  215. /* filter */
  216. #advanced-options .filter-widget {
  217. margin: 0px auto;
  218. padding: 12px 0px 0;
  219. width: 750px;
  220. }
  221.  
  222. #advanced-options .filter-widget select {
  223. margin-right: 8px;
  224. font-size: 12px;
  225. }
  226.  
  227. #advanced-options .filter-widget.title input[type=text] {
  228. width: 360px;
  229. }
  230.  
  231. #advanced-options .filter-widget.airing-status select,
  232. #advanced-options .filter-widget.publishing-status select {
  233. width: 152px;
  234. }
  235.  
  236. #advanced-options .filter-widget.producer select,
  237. #advanced-options .filter-widget.magazine select {
  238. width: 360px;
  239. }
  240.  
  241. #advanced-options .filter-widget.aired-date select.year,
  242. #advanced-options .filter-widget.published-date select.year {
  243. width: 80px;
  244. }
  245.  
  246. #advanced-options .filter-widget.aired-date select.month,
  247. #advanced-options .filter-widget.published-date select.month,
  248. #advanced-options .filter-widget.aired-date select.day,
  249. #advanced-options .filter-widget.published-date select.day {
  250. width: 60px;
  251. }
  252.  
  253. #advanced-options .filter-widget.aired-date .text,
  254. #advanced-options .filter-widget.published-date .text {
  255. display: inline-block;
  256. margin-right: 4px;
  257. font-size: 12px;
  258. }
  259.  
  260. #advanced-options .filter-widget.aired-season select.year {
  261. width: 80px;
  262. }
  263.  
  264. #advanced-options .filter-widget.aired-season select.season {
  265. width: 110px;
  266. }
  267.  
  268. #advanced-options .sort-widget .widget-header,
  269. #advanced-options .filter-widget .widget-header {
  270. display: inline-block;
  271. width: 110px;
  272. font-size: 12px;
  273. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  274. }
  275.  
  276. #advanced-options .sort-widget:last-of-type,
  277. #advanced-options .filter-widget:last-of-type {
  278. padding-bottom: 40px;
  279. }
  280.  
  281. #advanced-options .advanced-options-button {
  282. width: 750px;
  283. margin: 0px auto;
  284. padding: 12px 0px 0px;
  285. border-top: 1px solid #BEBEBE;
  286. text-align: center;
  287. }
  288.  
  289. #advanced-options .btn-apply,
  290. #advanced-options .btn-clear {
  291. background-color: rgba(0,0,0, 0.8);
  292. display: inline-block;
  293. width: 135px;
  294. margin: 0 4px;
  295. padding: 6px 0px;
  296. border-radius: 4px;
  297. font-size: 12px;
  298. color: #FFFFFF;
  299. text-align: center;
  300. -moz-transition-property: all;
  301. -o-transition-property: all;
  302. -webkit-transition-property: all;
  303. transition-property: all;
  304. -moz-transition-duration: 0.3s;
  305. -o-transition-duration: 0.3s;
  306. -webkit-transition-duration: 0.3s;
  307. transition-duration: 0.3s;
  308. -moz-transition-timing-function: ease-in-out;
  309. -o-transition-timing-function: ease-in-out;
  310. -webkit-transition-timing-function: ease-in-out;
  311. transition-timing-function: ease-in-out;
  312. }
  313.  
  314. #advanced-options .btn-apply:hover,
  315. #advanced-options .btn-clear:hover {
  316. background-color: rgba(0,0,0, 0.8);
  317. }
  318.  
  319.  
  320.  
  321. /**
  322. * General Styles
  323. */
  324.  
  325.  
  326. td {
  327. line-height: 1.5em;
  328. height: 35px !important;
  329. border:none !important;
  330. }
  331.  
  332. a {
  333. color: #fff;
  334. text-decoration: none;
  335. }
  336. a:hover {
  337. color: #fff !important;
  338. text-decoration: none;
  339. }
  340.  
  341. #footer-block {
  342. padding: 15px 0;
  343. background-color: #244291;
  344. color: #FFFFFF;
  345. font-family: Avenir, "lucida grande", tahoma, verdana, arial, sans-serif;
  346. display:none;
  347. }
  348.  
  349. #copyright {
  350. font-size: 12px;
  351. color: #FFFFFF;
  352. padding-top: 3px;
  353. text-align: center;
  354. }
  355.  
  356. /*
  357. * Header
  358. */
  359. .header a {
  360. font-weight: bold;
  361. color: #fff !important;
  362. }
  363. .header a:hover {
  364. text-decoration: underline;
  365. }
  366.  
  367. .header {
  368. position: absolute;
  369. color: #fff;
  370. display: block;
  371. width: 100%;
  372. height: 50px;
  373. margin: 0 auto
  374. border:none;
  375. background: -webkit-linear-gradient(rgba(0,0,0,.4), transparent); /* For Safari 5.1 to 6.0 */
  376. background: -o-linear-gradient(rgba(0,0,0,.4), transparent); /* For Opera 11.1 to 12.0 */
  377. background: -moz-linear-gradient(rgba(0,0,0,.4), transparent); /* For Firefox 3.6 to 15 */
  378. background: linear-gradient(rgba(0,0,0,.4), transparent); /* Standard syntax */
  379. -moz-transition-property: all;
  380. -o-transition-property: all;
  381. -webkit-transition-property: all;
  382. transition-property: all;
  383. -moz-transition-duration: 0.3s;
  384. -o-transition-duration: 0.3s;
  385. -webkit-transition-duration: 0.3s;
  386. transition-duration: 0.3s;
  387. -moz-transition-timing-function: ease-in-out;
  388. -o-transition-timing-function: ease-in-out;
  389. -webkit-transition-timing-function: ease-in-out;
  390. transition-timing-function: ease-in-out;
  391. z-index: 40;
  392. }
  393.  
  394. .header:hover {background-color:rgba(0,0,0,.5);
  395. -moz-transition-property: all;
  396. -o-transition-property: all;
  397. -webkit-transition-property: all;
  398. transition-property: all;
  399. -moz-transition-duration: 0.3s;
  400. -o-transition-duration: 0.3s;
  401. -webkit-transition-duration: 0.3s;
  402. transition-duration: 0.3s;
  403. -moz-transition-timing-function: ease-in-out;
  404. -o-transition-timing-function: ease-in-out;
  405. -webkit-transition-timing-function: ease-in-out;
  406. transition-timing-function: ease-in-out;
  407.  
  408. }
  409.  
  410. .header .header-menu {
  411. position: absolute;
  412. top: 5px;
  413. right: 4px
  414. }
  415. .header .header-menu.other {
  416. top: 5px;
  417. }
  418.  
  419.  
  420.  
  421. .header .header-menu .header-info {
  422. font-size: 10px;
  423. margin-top: 6px;
  424. margin-right: 15px;
  425. text-align: right;
  426. }
  427.  
  428. .header .username {
  429. font-weight: bold;
  430. }
  431.  
  432. .header .header-menu .list-menu {
  433. position: absolute;
  434. top: 25px;
  435. right: -4px;
  436. background-color: rgba(255,255,255,.8);
  437. display: none;
  438. border: none !important;
  439. -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  440. -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  441. box-shadow: rgba(0, 0, 0, 0.4) 0 0 10px;
  442. z-index: 1;
  443. }
  444.  
  445. .header .header-menu .list-menu .icon-menu {
  446. display: block;
  447. width: 150px;
  448. height: 30px;
  449. color: #000;
  450. font-size: 14px;
  451. font-weight: bold;
  452. text-decoration: none;
  453. -moz-transition-property: all;
  454. -o-transition-property: all;
  455. -webkit-transition-property: all;
  456. transition-property: all;
  457. -moz-transition-duration: 0.3s;
  458. -o-transition-duration: 0.3s;
  459. -webkit-transition-duration: 0.3s;
  460. transition-duration: 0.3s;
  461. -moz-transition-timing-function: ease-in-out;
  462. -o-transition-timing-function: ease-in-out;
  463. -webkit-transition-timing-function: ease-in-out;
  464. transition-timing-function: ease-in-out;
  465. }
  466.  
  467. .header .header-menu .list-menu .icon-menu:hover {
  468. background-color: rgba(0,0,0,.5);
  469. }
  470.  
  471. .header .header-menu .list-menu .icon-menu svg.icon {
  472. position: absolute;
  473. fill: rgba(0,0,0,.5);
  474. left: 12px;
  475. top: 4px;
  476. }
  477.  
  478. .header .header-menu .list-menu .icon-menu:hover svg.icon {
  479. fill: rgba(255,255,255,1) !important;
  480. }
  481.  
  482. .header .header-menu .list-menu .icon-menu .text {
  483. position: absolute;
  484. left: 52px;
  485. top: 6px;
  486. }
  487.  
  488. .header .header-menu .list-menu .icon-menu:hover .text {color:rgba(255,255,255,1) !important;}
  489.  
  490. .header .header-menu .btn-menu {
  491. display: block;
  492. text-align: right;
  493. color: rgba(0,0,0,0.7) !important;
  494. font-size: 12px !important;
  495. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000;
  496. }
  497.  
  498. #header-menu-dropdown > a {color: rgba(0,0,0,.5) !important;}
  499.  
  500. /* svg.icon.icon-manga-list {color: rgba(0,0,0,.5) !important;} */
  501.  
  502. /**
  503. * Floating Menu
  504. */
  505. /**
  506. * Floating Menu
  507. */
  508. .list-menu-float:before
  509. {content: "\f0c9";
  510. font-family: 'FontAwesome' !important;
  511. display: block;
  512. text-align: center !important;
  513. text-indent: 10px;
  514. color: #fff !important;
  515. font-size:1.5em !important;
  516. height: 50px;
  517. width: 40px;
  518. line-height: 50px;}
  519.  
  520. .list-menu-float:hover:before {
  521. font-size:1.7em !important;
  522. text-shadow: 0 0 2px #fff, 0 0 1px #fff, 1px 1px 7px #fff, 0 0 0 #fff;
  523. -moz-transition-property: all;
  524. -o-transition-property: all;
  525. -webkit-transition-property: all;
  526. transition-property: all;
  527. -moz-transition-duration: 0.3s;
  528. -o-transition-duration: 0.3s;
  529. -webkit-transition-duration: 0.3s;
  530. transition-duration: 0.3s;
  531. -moz-transition-timing-function: ease-in-out;
  532. -o-transition-timing-function: ease-in-out;
  533. -webkit-transition-timing-function: ease-in-out;
  534. transition-timing-function: ease-in-out;
  535. }
  536.  
  537. .list-menu-float
  538. {position: absolute;
  539. top: 0px;
  540. left:0px;
  541. width: 50px;
  542. border: none;
  543. opacity: 1;
  544. height: 40px !important;
  545. z-index: 100;
  546.  
  547. }
  548.  
  549. .list-menu-float .icon-menu
  550. {display: block;
  551. width: 120px;
  552. background-color: #dfdfdf;
  553. height: 30px;
  554. line-height: 30px;
  555. text-indent: 10px;
  556. opacity:0;
  557. }
  558.  
  559. .list-menu-float:hover .icon-menu
  560. {opacity:1;
  561. -moz-transition-property: all;
  562. -o-transition-property: all;
  563. -webkit-transition-property: all;
  564. transition-property: all;
  565. -moz-transition-duration: 0.3s;
  566. -o-transition-duration: 0.3s;
  567. -webkit-transition-duration: 0.3s;
  568. transition-duration: 0.3s;
  569. -moz-transition-timing-function: ease-in-out;
  570. -o-transition-timing-function: ease-in-out;
  571. -webkit-transition-timing-function: ease-in-out;
  572. transition-timing-function: ease-in-out;}
  573.  
  574. .list-menu-float .icon-menu.profile
  575. {background-image: none !important;}
  576.  
  577. .list-menu-float .icon-menu.profile:before
  578. {position:absolute;
  579. width:120px !important;
  580. content: "\f007\00a0Profile";
  581. font-family: 'FontAwesome' !important;
  582. margin-top:5px !important;
  583. margin-left:-65px !important;
  584. color: #000;
  585. text-align: center;}
  586.  
  587. .list-menu-float .icon-menu .text
  588. {opacity: 1;
  589. width: auto;
  590. left: 20px;
  591. top: 0;
  592. color: #555555;}
  593.  
  594. .list-menu-float .icon-menu:hover
  595. {width: 120px !important;
  596. background-color:rgba(0,0,0,.5) !important;}
  597.  
  598. .list-menu-float .icon-menu:hover .text, .list-menu-float .icon-menu:hover:before, .list-menu-float .icon-menu:hover:after
  599. {color: #fff;
  600. width: auto;}
  601.  
  602. .list-menu-float .icon-menu.logout
  603. {border-radius: 0 0 4px 4px;}
  604.  
  605. .list-menu-float .icon-menu.setting
  606. {display:none;}
  607.  
  608. .list-menu-float .icon-menu svg.icon
  609. {top: 7px !important;
  610. left: 5px !important;
  611. width: 15px;
  612. height: 15px;}
  613.  
  614. .list-menu-float .icon-menu.setting svg.icon-setting {display:none;}
  615. /**
  616. * List Container
  617. */
  618.  
  619. .list-container {
  620. position: absolute;
  621. background-color: transparent !important;
  622. width: 1000px;
  623. left: 0;
  624. right: 0;
  625. margin: auto;
  626. margin-top:100px;
  627. box-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000;
  628. border:none !important;
  629. margin-bottom:30px;
  630. }
  631.  
  632. /**
  633. * List Container - Cover Block
  634. */
  635. .cover-block {
  636. position:relative;
  637. display: block;
  638. width: 1000px;
  639. margin: 0 auto;
  640. height:auto;
  641. text-align: center;
  642. vertical-align: middle;
  643. /*box-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000;*/
  644. padding-bottom:40px;
  645.  
  646. }
  647.  
  648. .cover-block .image-container {
  649. display: block;
  650. width: 1000px;
  651. height:auto;
  652. padding-top:0;
  653. }
  654.  
  655. .cover-block .image-container.hide {
  656. display: none;
  657. }
  658.  
  659. .cover-block .image-container img {
  660. max-width: 1000px;
  661. height: auto;
  662. }
  663.  
  664. /* cover image */
  665.  
  666. #cover-image{
  667.  
  668. margin:auto;
  669. width:1000px !important;
  670. height:auto;
  671. background-color:transparent;
  672. background-size: cover !important;
  673. background-position: 50% 50%;
  674.  
  675. }
  676.  
  677. /* setting icon */
  678. .cover-block .image-container .btn-list-setting {
  679. display: none;
  680. }
  681.  
  682. .cover-block .image-container:hover .btn-list-setting {
  683. display: block;
  684. position: absolute;
  685. top: 20px;
  686. right: 28px;
  687. padding: 8px;
  688. border: rgba(255,255,255,0) 1px solid;
  689. font-size: 14px;
  690. color: #ffffff;
  691. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  692. }
  693.  
  694. .cover-block .image-container .btn-list-setting:hover {
  695. position: absolute;
  696. top: 20px;
  697. right: 28px;
  698. background-color: rgba(0,0,0,0.6);
  699. padding: 8px;
  700. border: none;
  701. -moz-box-shadow: 0 0 4px #000000;
  702. -webkit-box-shadow: 0 0 4px #000000;
  703. -o-box-shadow: 0 0 4px #000000;
  704. -ms-box-shadow: 0 0 4px #000000;
  705. box-shadow: 0 0 4px #000000;
  706. font-size: 14px;
  707. color: #ffffff;
  708. text-shadow: #323232 1px 1px 1px;
  709. }
  710.  
  711. .cover-block .image-container .btn-list-setting .fa-camera {
  712. font-size: 16px;
  713. -moz-text-shadow: #000000 1px 1px 3px;
  714. -webkit-text-shadow: #000000 1px 1px 3px;
  715. -o-text-shadow: #000000 1px 1px 3px;
  716. -ms-text-shadow: #000000 1px 1px 3px;
  717. text-shadow: #000000 1px 1px 3px;
  718. -ms-filter:"progid:DXImageTransform.Microsoft.DropShadow(color=#000000,offx=1,offy=1)";
  719. }
  720.  
  721. .cover-block .image-container .btn-list-setting .icon-plus-circle {
  722. position: absolute;
  723. top: 4px;
  724. left: 18px;
  725. background-color: rgba(0,0,0,0.6);
  726. border-radius: 50%;
  727. -moz-box-shadow: -1px 1px 0px 0px #323232;
  728. -webkit-box-shadow: -1px 1px 0px 0px #323232;
  729. -o-box-shadow: -1px 1px 0px 0px #323232;
  730. -ms-box-shadow: -1px 1px 0px 0px #323232;
  731. box-shadow: -1px 1px 0px 0px #323232;
  732. font-size: 10px;
  733. }
  734.  
  735. .cover-block .image-container .btn-list-setting .text {
  736. display: none;
  737. }
  738.  
  739. .cover-block .image-container .btn-list-setting:hover .text {
  740. display: inline-block;;
  741. margin-left: 4px;
  742. }
  743.  
  744.  
  745. /**
  746. * List Container - Status Menu
  747. */
  748. .status-menu-container {
  749. width: 1000px;
  750. height: 40px;
  751. background-color: rgba(255,255,255,.9);
  752. border-bottom: none;
  753. z-index: 1;
  754. margin-top:-40px;
  755. }
  756.  
  757. .status-menu-container.fixed {
  758. position: absolute;
  759. display: none !important;
  760. top: 0;
  761. }
  762.  
  763. .status-menu-container.fixed + div.list-block {
  764. margin-top: 0px;
  765. }
  766.  
  767. .status-menu-container .status-menu {
  768. display: table;
  769. margin: 0 auto;
  770. border-collapse: separate;
  771. border-spacing: 0px 0;
  772. }
  773.  
  774. .status-menu-container .status-menu .status-button {
  775. position: relative;
  776. display: table-cell;
  777. padding: 10px;
  778. left: 17px !important;
  779. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  780. text-align: center;
  781. vertical-align: middle;
  782. padding: 1.2em 10px;
  783. line-height: 1.105em;
  784. font-size: 1.1em;
  785. color: #9B9B9B;
  786. }
  787.  
  788. .status-menu-container .status-menu .status-button.on {
  789. color: #000;
  790. font-weight: bold;
  791. }
  792.  
  793. .status-menu-container .status-menu .status-button:hover {
  794. background-color: rgba(0,0,0,.5);
  795. color: #fff;
  796. -moz-transition-property: all;
  797. -o-transition-property: all;
  798. -webkit-transition-property: all;
  799. transition-property: all;
  800. -moz-transition-duration: 0.3s;
  801. -o-transition-duration: 0.3s;
  802. -webkit-transition-duration: 0.3s;
  803. transition-duration: 0.3s;
  804. -moz-transition-timing-function: ease-in-out;
  805. -o-transition-timing-function: ease-in-out;
  806. -webkit-transition-timing-function: ease-in-out;
  807. transition-timing-function: ease-in-out;
  808. }
  809.  
  810. .status-menu-container .status-menu .status-button.on:after, .status-menu .status-button:hover:after {
  811. opacity: 1
  812. }
  813.  
  814. .status-menu-container .status-menu .status-button.watching:before, .status-menu-container .status-menu .status-button.reading:before {
  815. content: "\f152\00a0\00a0";
  816. float: left;
  817. font-size: 1.5em;
  818. font-family: 'FontAwesome' !important;
  819. }
  820.  
  821. .status-menu-container .status-menu .status-button.completed:before {
  822. content: "\f05d\00a0\00a0";
  823. float: left;
  824. font-size: 1.5em;
  825. font-family: 'FontAwesome' !important;
  826. }
  827.  
  828. .status-menu-container .status-menu .status-button.onhold:before {
  829. content: "\f017\00a0\00a0";
  830. float: left;
  831. font-size: 1.5em;
  832. font-family: 'FontAwesome' !important;
  833. }
  834.  
  835. .status-menu-container .status-menu .status-button.plantowatch:before, .status-menu-container .status-menu .status-button.plantoread:before {
  836. content: "\f073\00a0\00a0";
  837. float: left;
  838. font-size: 1.5em;
  839. font-family: 'FontAwesome' !important;
  840. }
  841.  
  842. .status-menu-container .status-menu .status-button.dropped:before {
  843. content: "\f00d\00a0\00a0";
  844. float: left;
  845. font-size: 1.5em;
  846. font-family: 'FontAwesome' !important;
  847. }
  848.  
  849. .status-menu-container .status-menu .status-button.all_anime:before {
  850. content: "\f022\00a0";
  851. float: left;
  852. font-size: 1.5em;
  853. font-family: 'FontAwesome' !important;
  854. }
  855.  
  856. .status-menu-container .status-menu .status-button:after {display:none !important;}
  857.  
  858. /*scroll bar*/
  859.  
  860. ::-webkit-scrollbar
  861. {height: 7px;
  862. width: 15px;
  863. background-color: #f5f5f5;}
  864. ::-webkit-scrollbar-thumb
  865. {border: 2px solid #f5f5f5;
  866. background-color: #9B9B9B;}
  867.  
  868. /**
  869. * List Container - Status Menu - Search
  870. */
  871. .status-menu-container .search-container {
  872. position: absolute;
  873. right: 5px;
  874. z-index:20;
  875. }
  876. .status-menu-container .search-container #search-button {
  877. display: inline-block;
  878. height: 22px;
  879. margin-top: 10px;
  880. color: #787878;
  881. font-size: 1.6em;
  882. vertical-align: middle;
  883. }
  884.  
  885. .status-menu-container .search-container #search-box {
  886. display: inline-block;
  887. width: 0;
  888. height: 22px;
  889. overflow: hidden;
  890. margin-top: 5px;
  891. -webkit-transition: width 0.3s;
  892. -moz-transition: width 0.3s;
  893. transition: width 0.3s;
  894. -webkit-backface-visibility: hidden;
  895. vertical-align: middle;
  896. }
  897.  
  898. .status-menu-container .search-container #search-box.open {
  899. display: inline-block;
  900. width: 130px;
  901. }
  902.  
  903. .status-menu-container .search-container #search-box input {
  904. width: 100%;
  905. height: 100%;
  906. box-sizing: border-box;
  907. }
  908.  
  909.  
  910. /**
  911. * List Container - List Block
  912. */
  913. .list-block {
  914. margin: 0;
  915. min-height:265px;
  916. background: transparent;
  917. }
  918.  
  919. .list-unit {
  920. background-color:transparent;
  921. margin: auto;
  922. width: 1000px;
  923. /*box-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000;*/
  924. background: transparent;
  925. }
  926.  
  927. /**
  928. * List Container - List Status Title (with Stats)
  929. */
  930.  
  931.  
  932. .list-unit .list-status-title .text {
  933. display: block;
  934. width: 1000px;
  935. height: 38px !important;
  936. font-size: 22px;
  937. color: #fff;
  938. text-align: center;
  939. vertical-align: middle;
  940. text-align: center;
  941. font-weight: 500;
  942. letter-spacing: 0.5px;
  943. border:none;
  944. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #FFF !important;
  945. font-style: bold;
  946. background-color: transparent;
  947. margin-top: 363px !important;
  948. background-color: transparent;
  949. }
  950.  
  951.  
  952.  
  953.  
  954. .list-unit .list-status-title .stats a.filterd {
  955. text-shadow: 0px 0px 2px #FFF;
  956. }
  957.  
  958. .list-unit .list-status-title .stats a:hover {
  959. background:rgba(0,0,0,.5);
  960. padding:8px;
  961. -moz-transition-property: all;
  962. -o-transition-property: all;
  963. -webkit-transition-property: all;
  964. transition-property: all;
  965. -moz-transition-duration: 0.3s;
  966. -o-transition-duration: 0.3s;
  967. -webkit-transition-duration: 0.3s;
  968. transition-duration: 0.3s;
  969. -moz-transition-timing-function: ease-in-out;
  970. -o-transition-timing-function: ease-in-out;
  971. -webkit-transition-timing-function: ease-in-out;
  972. transition-timing-function: ease-in-out;
  973. }
  974.  
  975.  
  976. .list-unit .list-stats {
  977. background-color: rgba(255,255,255,.8);
  978. margin-top: -155px !important;
  979. color : #000;
  980. height: 25px;
  981. margin:auto;
  982. position: absolute;
  983. width: 1000px;
  984. z-index: 1 !important;
  985. }
  986.  
  987. .list-unit .list-status-title .stats {
  988. position: absolute;
  989. height: 40px;
  990. line-height: 40px;
  991. width:180px;
  992. right: -25px;
  993. margin-top: -441px;
  994. z-index: 1;
  995. background-color: transparent;
  996. }
  997.  
  998. .list-unit .list-status-title .stats a {
  999.  
  1000. color: #9B9B9B;
  1001. padding:8px;
  1002. margin:0 !important;
  1003. }
  1004.  
  1005.  
  1006. /**
  1007. * List Container - List Table
  1008. */
  1009.  
  1010. .list-table {
  1011. width: 100%;
  1012. margin: 0 auto;
  1013. border-collapse: collapse;
  1014. background-color:transparent !important;
  1015. color: #fff !important;
  1016. border:none;
  1017. }
  1018.  
  1019.  
  1020.  
  1021. /**
  1022. * List Container - List Table - Header
  1023. */
  1024.  
  1025. .list-table .list-table-header .header-title {
  1026.    background-color: transparent;
  1027.    border: none;
  1028.    color: #fff;
  1029. }
  1030.  
  1031. .list-table .list-table-header .header-title .link {
  1032.    color: #fff !important;
  1033. }
  1034.  
  1035.  
  1036. /* customize list */
  1037.  
  1038. .list-table .list-table-data {
  1039.  
  1040. }
  1041.  
  1042.  
  1043. .list-table .list-table-data:hover {
  1044. /*box-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000 !important;*/
  1045. transition: .2s linear;
  1046. background-color:rgba(0,0,0,.3);
  1047. }
  1048.  
  1049.  
  1050. .list-table .list-table-data:hover .data.title {
  1051. text-shadow: 0 0 2px #000, 0 0 1px #000, 0 1px 7px #000, 0 0 0.5px #000;
  1052. color:#fff;
  1053. transition: .1s linear;
  1054.  
  1055. }
  1056.  
  1057.  
  1058. .header a:hover,.list-table .list-table-data a:not(.edit-disabled):hover {
  1059. text-decoration:underline;
  1060. }
  1061.  
  1062.  
  1063. /**
  1064. * List Container - List Table - Items
  1065. */
  1066.  
  1067.  
  1068. .list-table .list-table-data .data {
  1069. display: table-cell;
  1070. padding: 4px 0;
  1071. text-align: center;
  1072. vertical-align: middle;
  1073. color: #fff !important;
  1074. border:none;
  1075. }
  1076.  
  1077. .list-table .list-table-data:hover .data {
  1078. color: #fff !important;
  1079.  
  1080. }
  1081.  
  1082. .list-table .list-table-data a:not(.edit-disabled):hover {
  1083. text-decoration: underline;
  1084. color: #fff !important;
  1085. }
  1086.  
  1087. .list-table .list-table-data a.edit-disabled {
  1088. cursor: text;
  1089. color: #fff;
  1090. }
  1091.  
  1092. .list-table .list-table-data .tags .edit {
  1093. display: block;
  1094. width: 100%;
  1095. text-align: center;
  1096. color: #2db039;
  1097. font-size: 10px;
  1098. font-family: 'Helvetica neue', Helvetica, "lucida grande", tahoma, verdana, arial, sans-serif;
  1099. display:none;
  1100. }
  1101. .list-table .list-table-data .tags .edit:hover {
  1102. display:none;
  1103. }
  1104.  
  1105. .list-table .list-table-data .tags textarea {
  1106. box-sizing: border-box;
  1107. width: 100%;
  1108. height: 60px;
  1109. }
  1110.  
  1111.  
  1112. .list-table .list-table-data .data.image a {
  1113. display:inline-block!important;
  1114. }
  1115.  
  1116.  
  1117. .list-table .list-table-data .data.image {
  1118. width:4%; }
  1119.  
  1120. .list-table .list-table-data .data.image .image {
  1121. width: 48px !important;
  1122. height: 68px !important;
  1123. background-size:cover;
  1124. border:2px solid #fff;
  1125. -webkit-box-shadow:2px 2px 8px -3px rgba(0,0,0,.76);
  1126. -moz-box-shadow:2px 2px 8px -3px rgba(0,0,0,.76);
  1127. box-shadow:2px 2px 8px -3px rgba(0,0,0,.76);
  1128. border-radius:180px;
  1129. display:inline-block!important;
  1130. }
  1131.  
  1132. .list-table .list-table-data:hover .data.image .image {
  1133. display:inline-block!important;
  1134. margin-left:-30px;
  1135. opacity: 0;
  1136. -moz-transition-duration: 0.3s ease-in-out;
  1137. -o-transition-duration: 0.3s ease-in-out;
  1138. -webkit-transition-duration: 0.3s ease-in-out;
  1139. transition-duration: 0.3s ease-in-out;
  1140. -moz-transition-timing-function: ease-in-out;
  1141. -o-transition-timing-function: ease-in-out;
  1142. -webkit-transition-timing-function: ease-in-out;
  1143. transition-timing-function: ease-in-out
  1144. -moz-transition:all .3s ease;-webkit-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease;
  1145. }
  1146.  
  1147.  
  1148. /* */
  1149. .list-table .list-table-data .data.season * {
  1150. color:#fff;
  1151. }
  1152.  
  1153. .list-table .list-table-data .data.title {
  1154. padding-left: 8px;
  1155. text-align: left;
  1156. width:60%;
  1157.  
  1158. }
  1159.  
  1160. .list-table .list-table-data .data.title a {
  1161. line-height:35px !important;
  1162. display: inline-block;
  1163. min-width:0;
  1164. max-width: 450px; /* the width of your titles */
  1165. white-space: nowrap;
  1166. text-overflow: ellipsis;
  1167. overflow: hidden; }
  1168.  
  1169. .list-table .list-table-data .data.title .link {
  1170. font-size: 18px !important;
  1171. text-decoration: none !important;
  1172. font-family: 'PT Sans Narrow', sans-serif;
  1173. font-weight:100 !important;
  1174. transition: all 0.3s ease 0s;
  1175. color: #fff;
  1176.  
  1177. }
  1178.  
  1179. .list-table .list-table-data:hover .data.title .link {
  1180. letter-spacing: 0.5px;
  1181. transition: all 0.3s ease 0s;
  1182. color: #fff !important;
  1183. }
  1184.  
  1185. .list-table .list-table-data .data.title .rewatching, .list-table .list-table-data .data.title .rereading, .list-table .list-table-data .data.title .content-status {
  1186. text-shadow: 0 0 2px #1a1aff, 0 0 1px #1a1aff, 1px 1px 7px #1a1aff, 0 0 0 #1a1aff !important;
  1187. color: #fff !important;
  1188. font-size: 0.9em !important;
  1189. margin-left:5px;
  1190. display:inline-block;
  1191. margin-top:10px !important;
  1192. position:absolute;
  1193. }
  1194.  
  1195. .list-table .list-table-data .data.score .link {
  1196. font-size: 1.5em;
  1197. font-weight: bold;
  1198. }
  1199.  
  1200. .list-table .list-table-data .data.score {
  1201. width: 21px !important;
  1202. height: 21px !important;
  1203. background-image: url();
  1204. background-repeat: no-repeat;
  1205. background-size:contain;
  1206. background-position: 50% 50%;
  1207. }
  1208.  
  1209. .list-table .list-table-data:hover .data.score {
  1210. background-image: url(http://i.imgur.com/EQcGOeO.png);
  1211. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 4px #000, 0 0 0 #000;
  1212. }
  1213.  
  1214. .list-table .list-table-data .data.score a {color:#fff !important;}
  1215.  
  1216. td.td1.borderRBL {
  1217. color:#fff;
  1218. }
  1219.  
  1220. /*add edit */
  1221.  
  1222. .list-table .list-table-data .data.title .add-edit-more {
  1223. float: right;
  1224. margin-right: 10px;
  1225. font-size:0 !important;
  1226. margin-top:10px;
  1227. }
  1228.  
  1229.  
  1230. .add-edit-more {
  1231. opacity: 0;
  1232. transition: all 0.2s ease 0s;
  1233.  
  1234. }
  1235. .list-item:hover .add-edit-more {
  1236. opacity: 1;
  1237. transition: all 0.2s ease 0s;
  1238. }
  1239.  
  1240. .list-table .list-table-data .data.title .edit a {
  1241. background-image: url(http://i.imgur.com/OT1yCLP.png);
  1242. display: inline-block;
  1243. width: 15px;
  1244. height: 15px;
  1245. background-size: cover;
  1246. color: transparent !important;
  1247. margin-right: 7px !important;
  1248. }
  1249.  
  1250. .list-table .list-table-data .data.title .more a {
  1251. background-image: url(http://i.imgur.com/cUAaila.png);
  1252. display: inline-block;
  1253. width: 15px;
  1254. height: 15px;
  1255. background-size: cover;
  1256. color: transparent !important;
  1257. }
  1258.  
  1259. .list-table .list-table-data .data.title .add a {
  1260. background-image: url(http://i.imgur.com/AoTgUAL.png);
  1261. display: inline-block;
  1262. width: 15px;
  1263. height: 15px;
  1264. background-size: cover;
  1265. color: transparent !important;
  1266. margin-right: 7px !important;
  1267. }
  1268.  
  1269.  
  1270. /* */
  1271. .list-table .list-table-data .data.title .more {
  1272. position: relative;
  1273. }
  1274.  
  1275. .list-table .more-info {
  1276. display: none;
  1277. }
  1278.  
  1279. .list-table .more-info .more-content {
  1280. padding: 10px;
  1281. }
  1282.  
  1283. /* */
  1284. .list-table .list-table-data .data.number {
  1285. width:2% !important;
  1286. }
  1287.  
  1288. .list-table .list-table-data:hover .data.number {
  1289. opacity:0;
  1290. }
  1291.  
  1292. /* review section */
  1293.  
  1294. .list-table .list-table-data .data.tags {
  1295. position: fixed;
  1296. right: calc( 50% + 510px);
  1297. top: calc(20% + 230px);
  1298. opacity: 0;
  1299. display: inline !important;
  1300. line-height: 16px !important;
  1301. font-family: Segoe UI, Atilla, Arial, Helvetica, sans-serif;
  1302. text-align:left;
  1303. width:150px !important;
  1304. height:auto !important;
  1305. background-color:rgba(0,0,0,.5);
  1306. box-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 4px #000, 0 0 0 #000;
  1307. pointer-events: none;
  1308. /* animation */
  1309. transition: opacity .3s linear, margin-left .5s ease, transform 1s ease-in-out;
  1310. z-index: 6;
  1311. }
  1312.  
  1313. .list-table .list-table-data .data.tags span:after {
  1314. position: fixed;
  1315.  
  1316. right: calc( 50% + 510px);
  1317. top: calc(20% + 230px);
  1318. opacity: 0;
  1319. display: block !important;
  1320. content:'';
  1321. width:150px !important;
  1322. height:auto;
  1323. pointer-events: none;
  1324. /* animation */
  1325. transition: opacity .3s linear, margin-left .5s ease, transform 1s ease-in-out;
  1326. }
  1327.  
  1328. .list-table .list-table-data:hover .data.tags, .list-table .list-table-data:hover .data.tags span:after {
  1329. opacity: 1;
  1330. padding:5px;
  1331. box-sizing: border-box;
  1332. right: calc( 50% + 510px);
  1333. transition: opacity .3s linear, margin-left .5s ease, transform 1s ease-in-out;
  1334.  
  1335. }
  1336.  
  1337. .list-table .list-table-data .data.tags * {color: #fff !important;}
  1338.  
  1339. .list-table .list-table-header .header-title.tags {
  1340. display:none;
  1341. }
  1342.  
  1343. .link.sort + a {display: none;} /* remove watch buttons */
  1344.  
  1345. .list-table .list-table-data .data.studio {
  1346. position:fixed;
  1347. width: 150px;
  1348. text-align:center;
  1349. right: calc( 50% + 511px);
  1350. top: calc(20% + 184px);
  1351. height: 30px !important;
  1352. opacity:0;
  1353. z-index: 60 !important;
  1354. background-color: transparent;
  1355. background: rgba(0,0,0,0);
  1356. background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
  1357. background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,.7)));
  1358. background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
  1359. background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
  1360. background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
  1361. background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.7) 100%);
  1362. pointer-events:none;
  1363. }
  1364.  
  1365. .list-table .list-table-data:hover .data.tags, .list-table .list-table-data:hover .data.studio {opacity:1;}
  1366.  
  1367. .list-item .data.studio * {
  1368. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000 !important;
  1369. font-weight: bold !important;
  1370. color:#fff !important;
  1371.  
  1372. }
  1373.  
  1374.  
  1375. /* */
  1376.  
  1377. .list-table .list-table-data .data.status {
  1378. width: 4px;
  1379. }
  1380.  
  1381. .list-table .list-table-data .data.status .text {
  1382. font-size:1.5em;
  1383. }
  1384.  
  1385. .list-table .list-table-data .data.status.reading, .list-table .list-table-data .data.status.watching {
  1386. /*background-color: #2db039 */
  1387. background-color:transparent;
  1388. }
  1389.  
  1390. .list-table .list-table-data .data.status.plantoread, .list-table .list-table-data .data.status.plantowatch {
  1391. /*background-color: #c3c3c3 */
  1392. background-color:transparent;
  1393. }
  1394.  
  1395. .list-table .list-table-data .data.status.completed {
  1396. /*background-color: #26448f */
  1397. background-color:transparent;
  1398. }
  1399.  
  1400. .list-table .list-table-data .data.status.onhold {
  1401. /*background-color: #f1c83e */
  1402. background-color:transparent;
  1403. }
  1404.  
  1405. .list-table .list-table-data .data.status.dropped {
  1406. /*background-color: #a12f31 */
  1407. background-color:transparent;
  1408. }
  1409.  
  1410. /* list status */
  1411. .list-table .list-table-data .data.status.completed:before, .list-table .list-table-data .data.status.reading:before, .list-table .list-table-data .data.status.watching:before,.list-table .list-table-data .data.status.plantoread:before, .list-table .list-table-data .data.status.plantowatch:before,.list-table .list-table-data .data.status.onhold:before,.list-table .list-table-data .data.status.dropped:before {
  1412. display: inline-block !important;
  1413. position: absolute;
  1414. margin-left:8px;
  1415. margin-top:-7px;
  1416. z-index: 100 !important;
  1417. content: "";
  1418. pointer-events: none;
  1419. opacity: 0;
  1420. text-align:center !important;
  1421. }
  1422.  
  1423. .list-table .list-table-data:hover .data.status.completed:before, .list-table .list-table-data:hover .data.status.reading:before, .list-table .list-table-data:hover .data.status.watching:before,.list-table .list-table-data:hover .data.status.plantoread:before, .list-table .list-table-data:hover .data.status.plantowatch:before,.list-table .list-table-data:hover .data.status.onhold:before,.list-table .list-table-data:hover .data.status.dropped:before {
  1424. opacity: 1;
  1425. text-align:center !important;
  1426. -moz-transition-property: all;
  1427. -o-transition-property: all;
  1428. -webkit-transition-property: all;
  1429. transition-property: all;
  1430. -moz-transition-duration: 0.3s;
  1431. -o-transition-duration: 0.3s;
  1432. -webkit-transition-duration: 0.3s;
  1433. transition-duration: 0.3s;
  1434. -moz-transition-timing-function: ease-in-out;
  1435. -o-transition-timing-function: ease-in-out;
  1436. -webkit-transition-timing-function: ease-in-out;
  1437. transition-timing-function: ease-in-out;
  1438. }
  1439.  
  1440. .list-table .list-table-data:hover .data.status.completed:before {
  1441. /* background-color: #26448f !important; */
  1442. color:#fff;
  1443. content: "\f05d";
  1444. font-size: 1.5em;
  1445. font-family: 'FontAwesome' !important;
  1446. }
  1447.  
  1448. .list-table .list-table-data:hover .data.status.watching:before, .list-table .list-table-data:hover .data.status.reading:before
  1449. {
  1450. /*background-color: #2db039 !important;*/
  1451. color:#fff;
  1452. content: "\f152";
  1453. font-size: 1.5em;
  1454. font-family: 'FontAwesome' !important;}
  1455.  
  1456. .list-table .list-table-data:hover .data.status.plantowatch:before, .list-table .list-table-data:hover .data.status.plantoread:before
  1457. {/*background-color: #c3c3c3 !important;*/
  1458. color:#fff;
  1459. content: "\f073";
  1460. font-size: 1.5em;
  1461. font-family: 'FontAwesome' !important;}
  1462.  
  1463. .list-table .list-table-data:hover .data.status.onhold:before
  1464. {/*background-color: #f1c83e !important;*/
  1465. color:#fff;
  1466. content: "\f017";
  1467. font-size: 1.5em;
  1468. font-family: 'FontAwesome' !important;}
  1469.  
  1470. .list-table .list-table-data:hover .data.status.dropped:before
  1471. {/*background-color: #a12f31 !important;*/
  1472. color:#fff;
  1473. content: "\f00d";
  1474. font-size: 1.5em;
  1475. font-family: 'FontAwesome' !important;}
  1476.  
  1477.  
  1478.  
  1479.  
  1480.  
  1481. /* */
  1482.  
  1483.  
  1484.  
  1485. .list-unit .loading-space {
  1486. background-color:rgba(0, 0, 0, .3);
  1487. color: #fff !important;
  1488. display: inline-block;
  1489. margin: auto;
  1490. width: 1000px;
  1491. font-size: 11px;
  1492. line-height:15px;
  1493. text-align: middle !important;
  1494. padding-top: 0px;
  1495. margin-bottom: 0px;
  1496. height:250px;
  1497. background-attachment:scroll;
  1498. background-image:url();
  1499. background-repeat: no-repeat no-repeat;
  1500. background-position: 0% 100%;
  1501. }
  1502.  
  1503. /*override codes*/
  1504. .header .header-info > a {color: rgba(255,255,255,1) !important;}
  1505. .header .header-info {color: rgba(255,255,255,0.8) !important;}
  1506. .header .header-menu {color: rgba(255,255,255,0.8) !important;}
  1507. .header .header-menu .btn-menu {color: rgba(255,255,255,0.8) !important;}
  1508. .username {color: rgba(255,255,255,0.8) !important;}
  1509. #header-menu-button {color: rgba(255,255,255,0.8) !important;}
  1510. .header a {
  1511. font-weight: bold;
  1512. color: #fff !important;
  1513. }
  1514. .icon-watch, .icon-watch-pv {display:none !important;}
  1515. /*profile image & name */
  1516.  
  1517. .cover-block::after {
  1518. height: 120px !important;
  1519. width: 120px! important;
  1520. background-repeat: no-repeat;
  1521. background-size: contain;
  1522. position: absolute;
  1523. display:block !important;
  1524. margin-left:57px;
  1525. margin-top:-70px;
  1526. content: "";
  1527. z-index: 2 !important;
  1528. padding: 5px;
  1529. background-color:#fff;
  1530. box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.3);
  1531. border-radius:5px;
  1532. border: #fff 2px solid;
  1533. }
  1534.  
  1535. .cover-block::before {
  1536. position: absolute;
  1537. display:block !important;
  1538. margin-left:200px;
  1539. bottom:40px;
  1540. width: 300px;
  1541. color: #ffffff;
  1542. font-size: 29px !important;
  1543. font-family: Rancho;
  1544. text-align: left;
  1545. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #000 !important;
  1546. letter-spacing: 0 !important;
  1547. }
  1548.  
  1549. /* */
  1550. .header .header-title {
  1551. position: absolute;
  1552. top: 0px;
  1553. left: 40px;
  1554. background-image: url("http://i.imgur.com/39cRtfK.png");
  1555. background-position: left top;
  1556. background-repeat: no-repeat;
  1557. background-size: auto 50px;
  1558. display: block;
  1559. width: 50px !important;
  1560. height: 50px;
  1561. text-indent: -9999px;
  1562. overflow: hidden
  1563. }
  1564.  
  1565. /* customization */
  1566.  
  1567. /* The list background */
  1568.  
  1569. body[data-query*='"status":1'],
  1570. body[data-query*='"status":2'],
  1571. body[data-query*='"status":3'],
  1572. body[data-query*='"status":4'],
  1573. body[data-query*='"status":6'],
  1574. body[data-query*='"status":7'] {
  1575. background-attachment: fixed !important;
  1576. background-position: center top;
  1577. background-repeat: no-repeat !important;
  1578. background-size:cover;
  1579. }
  1580.  
  1581. * {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1054.cur), progress !important;}
  1582.  
  1583. /* */
  1584.  
  1585.  
  1586.  
  1587. span a[href*="&tag=!"], span a[href*="&tag=%40"], span a[href*="&tag=~"] {display: none !important;}
  1588.  
  1589. /* favorite */
  1590. @media
  1591. AnimeList
  1592. MangaList
  1593. Message
  1594. entrytags-favorites {}
  1595. a[href$="&tag=*"]
  1596. {position: absolute;
  1597. left: 0;
  1598. width: 150px;
  1599. height: 0;
  1600. font-size: 15px;
  1601. top: 0px;
  1602. color: transparent !important;
  1603.  
  1604. }
  1605.  
  1606. a[href$="&tag=*"]:after
  1607. {content: '\f005';
  1608. font-family: 'FontAwesome' !important;
  1609. display: inline-block;
  1610. pointer-events: all;
  1611. /* change the position below, and add in margin-whatever if it's not enough */
  1612. position: absolute;
  1613. top: -224px;
  1614. left: 130px;
  1615. /* change the size of font */
  1616. font-size: 1.1em;
  1617. color: #fff !important;
  1618. text-shadow: 0 0 2px #000, 0 0 1px #000, 1px 1px 7px #000, 0 0 0 #fff !important;
  1619. pointer-events:none;
  1620. }
  1621.  
  1622.  
  1623.  
  1624. /* Intro animation */
  1625. @keyframes intro {
  1626. from {
  1627. opacity: 0;
  1628. margin-top: 100vh;
  1629. }
  1630. 16% {
  1631. opacity: 0;
  1632. margin-top: 100vh;
  1633. }
  1634. to {
  1635. opacity: 1;
  1636. margin-top: 100px;
  1637. }
  1638. }
  1639. .list-container {
  1640. animation: intro 3s;
  1641. }
  1642.  
  1643.  
  1644.  
  1645. /* */
  1646.  
  1647. footer {
  1648. position: fixed;
  1649. bottom: 0px;
  1650. left: 0px;
  1651. width: 100%;
  1652. height:30px !important;
  1653. z-index: 9998;
  1654.  
  1655. }
  1656.  
  1657. #footer-block {
  1658. display:block;
  1659. background-color: transparent;
  1660. background: rgba(0,0,0,0);
  1661. background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
  1662. background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,.6)));
  1663. background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
  1664. background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
  1665. background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
  1666. background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%);
  1667. }
  1668.  
  1669.  
  1670.  
  1671. .list-unit .list-status-title:after {
  1672. color: transparent;
  1673. height: 365px !important;
  1674. width: 1000px !important;
  1675. background-repeat: no-repeat;
  1676. background-size: cover;
  1677. position: absolute !important;
  1678. display: block !important;
  1679. left: 0 !important;
  1680. right: 0 !important;
  1681. top: 0px !important;
  1682. content: "";
  1683. z-index: 1 !important;
  1684. pointer-events: none;
  1685. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement