Newser

Untitled

Dec 14th, 2015
58
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.02 KB | None | 0 0
  1. /* NAVBAR */
  2. @import "http://googledrive.com/host/0Bz6PekZ3y6B9WkxISjNLOWVPeTg/";
  3. /* COVERS */
  4. @import "https://googledrive.com/host/0BxjwQr0BBXs-aDYxM2JlaFM2bnM";
  5. /* FONTS */
  6. @import "http://fonts.googleapis.com/css?family=Carrois+Gothic+SC";
  7.  
  8. #inlineContent {
  9. background: url("http://images2.alphacoders.com/224/224760.jpg") center no-repeat;
  10. background-size: cover;
  11. display: inline-block !important;
  12. height: 100% ;
  13. left: 0px ;
  14. position: fixed ;
  15. right: 0 ;
  16. top: 0 ;
  17. width: 100% ;
  18. z-index: -1 ;}
  19.  
  20. #list_surround {
  21. font-size: 97%;
  22. font-weight: normal;
  23. line-height: 1;
  24. padding-bottom: 15px;
  25. padding-top: 25px;
  26. padding-left: 150px;
  27. width: 720px;
  28. }
  29.  
  30.  
  31. /* FONT */
  32. body {
  33. font-family: 'Carrois Gothic SC';
  34. text-transform: uppercase;
  35. color: #FFFFFF;
  36. }
  37.  
  38.  
  39. /* LINKS */
  40. a {
  41. -moz-transition: all 0.25s ease-in-out 0s;
  42. -webkit-transition: all 0.25s ease-in-out 0s;
  43. -o-transition: all 0.25s ease-in-out 0s;
  44. transition: all 0.25s ease-in-out 0s;
  45. color: #EEEEEE;
  46. text-decoration: none;
  47. text-shadow: none;
  48. }
  49. a:hover {
  50. color: #EEEEEE;
  51. text-shadow: 0 1px rgba(255, 255, 255, 0.15);
  52. }
  53.  
  54.  
  55. /* CATEGORY LINKS */
  56. .status_not_selected a {
  57. background-color: rgba(64, 60, 90, 0.6);
  58. border-color: rgba(48, 44, 64, 0.5);
  59. border-radius: 2px 2px 2px 2px;
  60. border-style: solid;
  61. border-width: 2px;
  62. color: #FFFFFF;
  63. display: block ;
  64. font-weight: normal;
  65. padding: 8px;
  66. text-shadow: 0 1px rgba(0, 0, 0, 0.1);
  67. }
  68. .status_selected a {
  69. background-color: #403C5A;
  70. border-color: rgba(48, 44, 64, 0.5);
  71. border-radius: 2px 2px 2px 2px;
  72. border-style: solid;
  73. border-width: 2px;
  74.  
  75.  
  76. }
  77. .status_not_selected a:hover {
  78. background-color: #403C5A;
  79. border-color: #201C3A;
  80. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  81. text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  82. }
  83. .status_selected a:hover {
  84. background-color: #403C5A;
  85. border-color: #201C3A;
  86. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  87. text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  88. }
  89.  
  90.  
  91. /* HEADER */
  92. .table_header {
  93. color: #FFFFFF;
  94. font-size: 110%;
  95. background-color: rgba(64, 60, 90, 0.6);
  96. text-align: center;
  97.  
  98. }
  99. .table_header:first-of-type {
  100. border-radius: 12px 0 0 0;
  101. }
  102. .table_header:nth-of-type(2) {
  103. text-align: center;
  104. }
  105. .table_header:last-of-type {
  106. border-radius: 0 12px 0 0;
  107. }
  108.  
  109.  
  110.  
  111. /* ROWS COLOR */
  112. .td1 {
  113. -moz-transition: all 0.25s ease-in-out 0s;
  114. -webkit-transition: all 0.25s ease-in-out 0s;
  115. -o-transition: all 0.25s ease-in-out 0s;
  116. transition: all 0.25s ease-in-out 0s;
  117. background-color: rgba(0, 0, 0, 0.6);
  118. text-align: center;
  119. }
  120. .td2 {
  121. -moz-transition: all 0.25s ease-in-out 0s;
  122. -webkit-transition: all 0.25s ease-in-out 0s;
  123. -o-transition: all 0.25s ease-in-out 0s;
  124. transition: all 0.25s ease-in-out 0s;
  125. background-color: rgba(0, 0, 0, 0.8);
  126. text-align: center;
  127. }
  128.  
  129. .animetitle + small {
  130. text-transform: lowercase;
  131. }
  132.  
  133. /* ROWS HOVER */
  134. tr:hover [class^="td"] {
  135. background-color: rgba(72, 64, 74, 0.6);z
  136. }
  137. .td1:nth-of-type(2), .td2:nth-of-type(2) {
  138. text-align: center;
  139. }
  140.  
  141. /* LIST SETTINGS */
  142. .table_header, .td1, .td2, .category_totals {
  143. padding: 4px;
  144. text-align: center;
  145. vertical-align: middle;
  146. }
  147. .table_header, .td1, .td2, .category_totals {
  148. line-height: 30px;
  149. }
  150. .borderRBL{
  151. line-height: normal ;
  152. }
  153. [cellspacing="0"] {
  154. line-height: 14px;
  155. }
  156. [class^="header_"] +{
  157. border-collapse: separate ;
  158. }
  159.  
  160.  
  161. /* CATEGORY TOTALS */
  162. .category_totals {
  163. -moz-transition: all 0.25s ease-in-out 0s;
  164. -webkit-transition: all 0.25s ease-in-out 0s;
  165. -o-transition: all 0.25s ease-in-out 0s;
  166. transition: all 0.25s ease-in-out 0s;
  167. background-color: rgba(72, 64, 87, 0);
  168. border-radius: 0 0 12px 12px;
  169. color: rgba(51, 51, 51, 0);
  170. text-align: center;
  171. font-style: italic;
  172. }
  173. .category_totals:hover {
  174. background-color: rgba(72, 64, 74, 0.6);
  175. color: #EEEEEE;
  176. font-size: small;
  177. }
  178.  
  179.  
  180. /* HEADER TEXT AND DIMENSIONS */
  181. [class^="header_"] * {
  182. font-size: 17px;
  183. background-color: rgba(0, 0, 0, 0);
  184. border-radius: 3px 3px 3px 3px;
  185. color: #EEEEEE;
  186. text-shadow: 2px 2px 2px #000000;
  187. line-height: 17px;
  188. margin-top: 10px;
  189. padding: 8px;
  190. text-align: left;
  191. }
  192.  
  193. .header_cw {
  194.     background-color: transparent;
  195.     background-image: url("http://i41.tinypic.com/qp4ewj.png");
  196.     background-position: 50% 0;
  197.     background-repeat: no-repeat no-repeat;
  198.     height: 200px;
  199. }
  200. .header_completed {
  201.     background-color: transparent;
  202.     background-image: url("http://i41.tinypic.com/2iha269.png");
  203.     background-position: 50% 0;
  204.     background-repeat: no-repeat no-repeat;
  205.     height: 200px;
  206.     z-index: 0;
  207. }
  208. .header_onhold {
  209.     background-color: transparent;
  210.     background-image: url("http://i39.tinypic.com/5fhwkz.png");
  211.     background-position: 50% 0;
  212.     background-repeat: no-repeat no-repeat;
  213.     height: 200px;
  214. }
  215. .header_dropped {
  216.     background-color: transparent;
  217.     background-image: url("http://i42.tinypic.com/f2n50y.png");
  218.     background-position: 50% 0;
  219.     background-repeat: no-repeat no-repeat;
  220.     height: 200px;
  221. }
  222. .header_ptw {
  223.     background-color: transparent;
  224.     background-image: url("http://i39.tinypic.com/2ahh7t.png");
  225.     background-position: 50% 0;
  226.     background-repeat: no-repeat no-repeat;
  227.     height: 200px;
  228. }
  229. .header_title {
  230. display: inline-block;
  231. font-family: Blackoak Std;
  232. font-size: 17px;
  233. height: auto;
  234. padding: 0 8px 0 0;
  235. text-shadow: 2px 2px 4px black;
  236. opacity: 0;
  237. pointer-events: none;
  238. }
  239.  
  240.  
  241. /* BOTTOM OF LIST */
  242. #grand_totals {
  243. background-color: rgba(0, 0, 0, 0.5);
  244. border-radius: 3px 3px 3px 3px;
  245. color: #EEEEEE;
  246. line-height: 20px;
  247. min-height: 20px;
  248. padding: 8px;
  249. text-align: center;
  250. vertical-align: middle;
  251. font-style: italic;
  252. font-size: small;
  253. }
  254. #copyright {
  255. color: black;
  256. font-size: 10px;
  257. position: fixed;
  258. bottom: 0px;
  259. right: 10px;
  260.  -webkit-text-stroke: 1px black;
  261. clear: both;
  262. }
  263.  
  264. @-webkit-keyframes tada {
  265.     0% {-webkit-transform: scale(1);}
  266.     10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}
  267.     30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}
  268.     40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}
  269.     100% {-webkit-transform: scale(1) rotate(0);}
  270. }
  271. @keyframes tada {
  272.     0% {transform: scale(1);}
  273.     10%, 20% {transform: scale(0.9) rotate(-3deg);}
  274.     30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
  275.     40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
  276.     100% {transform: scale(1) rotate(0);}
  277. }
  278. #mal_cs_otherlinks strong  a:hover {
  279. background-color: transparent !important;
  280.     -webkit-animation-name: tada;
  281.     animation-name: tada;
  282. -webkit-animation-duration: 1s;
  283.     animation-duration: 1s;
  284.     -webkit-animation-fill-mode: both;
  285.     animation-fill-mode: both;
  286. }
  287.  
  288.  
  289.  
  290. /* COVERS */
  291. .hide {
  292. background-size: cover;
  293. left: -150px;
  294. vertical-align: 50%;
  295. height: 176px;
  296. width: 114px;
  297. padding-bottom: 0px;
  298. border-style: solid;
  299. border-top: 1px solid transparent;;
  300. border-left: 1px solid transparent;
  301. border-right: 1px solid transparent;
  302. border-bottom: 1px solid transparent;
  303. border-radius: 25px 25px 25px 25px;
  304. background-position: center 50% !important;
  305. background-repeat: no-repeat !important;
  306. display: block !important;
  307. position: absolute;
  308. visibility: hidden;
  309. opacity: 0;
  310. }
  311.  
  312.  
  313. /*Centre panel to line*/
  314. .hide {
  315.     -ms-transform: translateY(-78px); /* IE 9 */
  316.     -webkit-transform: translateY(-78px); /* Chrome, Safari, Opera */
  317.     transform: translateY(-78px);
  318. }
  319.  
  320. @keyframes Covers {
  321.   from {
  322.     left: -150px;
  323.   }
  324.   to {
  325.     left: 36px;
  326.   }
  327. }
  328.  
  329. /* Show panel when name hovered over */
  330. :hover + .hide {
  331. animation: Covers 0.7s ease-out;
  332. animation-fill-mode: forwards;
  333. visibility: visible;
  334. opacity: 1;
  335. }
  336.  
  337. /*
  338. CODES (REPLACEMENT FOR "CSS FOR FOXGIRLS" IMPORT)
  339. Used to remove the "more" button (which no longer works after using the code above to show covers). Also helps with settings for the tag hover option if you use that.
  340. */
  341.  
  342. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(3),
  343. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(4),
  344. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(5),
  345. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(6),
  346. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(7),
  347. #list_surround tab\le:nth-of-type(n+4):hover td:nth-of-type(8) {
  348.     display: tab\le-cell;
  349. }
  350.  
  351. #list_surround small a:last-of-type {
  352.     display: none ;
  353. }
  354.  
  355. .animetitle + small {
  356.     visibility: visible ;
  357. }
  358.  
  359. #list_surround a[href*="http://myanimelist.net/panel.php?go=edit"],
  360. #list_surround a[href*="http://myanimelist.net/editlist.php?type="],
  361. #list_surround a[href*="http://myanimelist.net/panel.php?go=add"] {
  362.     visibility: visible ;
  363.     margin-right: 10px
  364. }
  365.  
  366. .td1:nth-of-type(6) small, .td2:nth-of-type(6) small,
  367. .td1:nth-of-type(5) small, .td2:nth-of-type(5) small,
  368. .td1:nth-of-type(4) small, .td2:nth-of-type(4) small {
  369.     visibility: visible ;
  370. }
  371.  
  372. .td1:nth-of-type(6) small:hover, .td2:nth-of-type(6) small:hover,
  373. .td1:nth-of-type(5) small:hover, .td2:nth-of-type(5) small:hover,
  374. .td1:nth-of-type(4) small:hover, .td2:nth-of-type(4) small:hover{
  375.     text-decoration: underline;
  376. }
  377.  
  378. #mal_cs_links > div:nth-child(1) {
  379.    display:-footer-group; }
Advertisement
Add Comment
Please, Sign In to add comment