API tools faq
paste
Ignbaltasevicius

CSS code: Cursed Matrix

Ignbaltasevicius
May 30th, 2020
142
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.40 KB | None | 0 0
raw download clone embed print report
  1. body{background:#000;color:#0f0;background-image: url(https://i.gifer.com/7RzT.gif);
  2. background-position: left top;
  3. background-repeat: repeat;
  4. background-attachment: scroll;
  5. cursor: crosshair;
  6. font-family: Fantasy;
  7. }
  8. @-webkit-keyframes shake {
  9. 0% { -webkit-transform: translate(10px, 0); }
  10. 20% { -webkit-transform: translate(-10px, 0); }
  11. 10% { -webkit-transform: translate(8px, 0); }
  12. 40% { -webkit-transform: translate(-8px, 0); }
  13. 50% { -webkit-transform: translate(4px, 0); }
  14. 60% { -webkit-transform: translate(-4px, 0); }
  15. 70% { -webkit-transform: translate(4px, 0); }
  16. 80% { -webkit-transform: translate(-2px, 0); }
  17. 0% { -webkit-transform: translate(2px, 0); }
  18. 100% { -webkit-transform: translate(0, 0); }
  19. 10% { box-shadow: 0 0 2.3rem #00ee00;}
  20. }
  21. .boxInfo {
  22. border: 3px solid #0000;
  23. background-image: url(https://i.pinimg.com/originals/4d/63/cb/4d63cbbd5500eeca274989bb174879bb.gif);
  24. margin-bottom: 30px;
  25. margin-top: 30px;
  26. }
  27. .player {
  28. padding: 4px;
  29. margin-top: 20px;
  30. margin-bottom: 20px;
  31. background: url(https://media.giphy.com/media/9WC8WTZsFxkRi/giphy.gif);
  32. border: 1px solid #00b600;
  33. color: #00FF00;
  34. -webkit-animation-name: shake;
  35. -webkit-animation-duration: 0.9s;
  36. -webkit-transform-origin:50% 50%;
  37. -webkit-animation-iteration-count: infinite;
  38. -webkit-animation-timing-function: linear;
  39. width: calc(100% - 10px );
  40. text-shadow: 1px 1px black;
  41. }
  42.  
  43. .topRight {
  44. float: right;
  45. width: calc( 60% - 20px);
  46. padding: 10px;
  47. background: url(https://media.giphy.com/media/9WC8WTZsFxkRi/giphy.gif);
  48. filter: brightness(85%) grayscale(0%) sepia(1000%) hue-rotate(60deg) saturate(450%) contrast(1.5);
  49. opacity: 0.9;}
  50.  
  51. .topLeft {
  52. float: left;
  53. width: calc( 40% - 20px);
  54. padding: 10px;
  55. background: url(https://media.giphy.com/media/ohONS2y8GTDoI/giphy.gif);
  56. color: #00FF00;
  57. text-shadow: 3px 2px #000000;
  58. font-family: fantasy;
  59. opacity: 0.9;
  60. }​
  61. .topLeft:after {
  62. padding: 4px;
  63. margin-top: 20px;
  64. margin-bottom: 20px;
  65. background: url(https://media.giphy.com/media/9WC8WTZsFxkRi/giphy.gif);
  66. border: 1px solid #00b600;
  67. color: #00FF00;
  68. content: url(https://i.pinimg.com/originals/a5/0e/dc/a50edc87151939a7a105982b12908432.gif);}
  69.  
  70. .blogs, .blog {
  71. margin-bottom: 20px;
  72. color: #00ff00;
  73. text-shadow: 1px 1px #090000;
  74. font: caption;
  75. font-family: Fantasy;
  76. }
  77. .extended {
  78. / border: 1px solid #006622; /
  79. text-align: center;
  80. color: #00ff00;
  81. margin-bottom: 20px;
  82. margin-top: 15px;
  83. text-shadow: 1px 1px black;
  84. font-family: monospace;
  85. }
  86. .tableLeft {
  87. background-image: url(https://i.pinimg.com/originals/61/f0/de/61f0de8e63452614dcdc7c6aac3fa2ee.gif);
  88. width: 15%;
  89. padding: 10px;
  90. vertical-align: top;
  91. overflow-wrap: anywhere;
  92. -webkit-animation-name: shake;
  93. -webkit-animation-duration: 0.9s;
  94. -webkit-transform-origin:50% 50%;
  95. -webkit-animation-iteration-count: infinite;
  96. -webkit-animation-timing-function: linear;
  97. }
  98.  
  99. .tableRight {
  100. width: 75%;
  101. background-image: url(https://i.pinimg.com/originals/61/f0/de/61f0de8e63452614dcdc7c6aac3fa2ee.gif);
  102. padding: 0px;
  103. vertical-align: top;
  104. overflow-wrap: anywhere;
  105. filter: brightness(85%) grayscale(100%) sepia(1000%) hue-rotate(70deg) saturate(300%) contrast(1.5);
  106.  
  107. }
  108. .url {
  109. border: solid 2px #69c0;
  110. padding: 20px;
  111. color: #00FF00;
  112. text-shadow: 1px 1px black;
  113. }
  114. a {
  115. color: #5f5;
  116. text-decoration: line-through;
  117. text-shadow: 1px 2px #00ff00;
  118. background: url(https://i.gifer.com/SuIE.gif);
  119. -webkit-animation-name: shake;
  120. -webkit-animation-duration: 0.9s;
  121. -webkit-transform-origin:50% 50%;
  122. -webkit-animation-iteration-count: infinite;
  123. -webkit-animation-timing-function: linear;
  124. }
  125. li {
  126. color: darkred;
  127. text-shadow: 1px 1px black;
  128. }
  129.  
  130. #audio {
  131. border: solid 1px #fff;
  132. padding: 2px;
  133. margin-bottom: 0px;
  134. margin-top: 5px;
  135. width: 100%;
  136. height: 30px;
  137. color: #fff;
  138. background: #fff;
  139. outline: none;
  140. margin-bottom: -3px;
  141. filter: sepia(0%) saturate(100%) grayscale(0) contrast(100%) invert(100%);
  142. }
  143. p {
  144. margin: 14px;
  145. color: #00FF00;
  146. text-align: justify;
  147. text-shadow: 1px 1px 1px #005555;
  148. }
  149. .blog {
  150. background-color: #007722;
  151. padding: 15px;
  152. }
  153. div#header {
  154. background: linear-gradient(45deg, #006600, #000000, #000000, #006600);
  155. }
  156. div#hSub {
  157. background: radial-gradient(#047700, #041500, transparent);
  158. }
  159.  
  160. header a:not(.logo) {
  161. margin-left: 10px;
  162. color: #062;
  163. font-size: small;
  164. text-decoration: none;
  165. text-shadow: 2px 2px black;
  166. }
  167. h4 {
  168. color: #00FF00;
  169. margin-bottom: 0px;
  170. align: center;
  171. text-shadow: 1px 1px #000000;
  172. background-image: url(https://i.gifer.com/KYql.gif);
  173. padding: 2px;
  174. -webkit-animation-name: shake;
  175. -webkit-animation-duration: 0.9s;
  176. -webkit-transform-origin:50% 50%;
  177. -webkit-animation-iteration-count: infinite;
  178. -webkit-animation-timing-function: linear;
  179. }
  180. hSub a {
  181. color: #00FF00;
  182. text-decoration: none;
  183. text-shadow: 1px 1px #00FF55;
  184. font-size: medium;
  185. }
  186. .boxButton {
  187. display: inline-block;
  188. width: calc( 49% - 60px );
  189. padding-left: 30px;
  190. height: 24px;
  191. font-size: small;
  192. color: #00FF00;
  193. padding-top: 7px;
  194. text-shadow: 1px 1px black;
  195. }
  196. b {
  197. color: #00AA22;
  198. text-shadow: 1px 1px black;
  199. backgroubd-color: #000000
  200. border-color: green;
  201. text-align: center;
  202. font-family: fantasy;
  203. font-size: large;
  204.  
  205. }
  206. .fwiendCount {
  207. color: #00FF00;
  208. text-shadow: 1px 1px black;
  209. }
  210. button {
  211. width: max-content;
  212. background: #003300;
  213. color: #00FF00;
  214. border: #000000;
  215. }
  216. .rightHead {
  217. background-image: url(https://i.gifer.com/KYql.gif);
  218. -webkit-animation-name: shake;
  219. -webkit-animation-duration: 0.9s;
  220. -webkit-transform-origin:50% 50%;
  221. -webkit-animation-iteration-count: infinite;
  222. -webkit-animation-timing-function: linear;
  223. }
  224. .boxHead{
  225. background-image: url(https://i.gifer.com/KYql.gif);
  226. text-color: #00FF00;
  227. -webkit-animation-name: shake;
  228. -webkit-animation-duration: 0.9s;
  229. -webkit-transform-origin:50% 50%;
  230. -webkit-animation-iteration-count: infinite;
  231. -webkit-animation-timing-function: linear;
  232. overflow: visible;
  233. }
  234.  
  235. #commentInput{
  236. background-image: url(https://media1.tenor.com/images/7cad7ace0a3d2f6b7a15eb2df43fa780/tenor.gif?itemid=13470084);
  237. color: #00ff00;
  238. text-color: #00FF00;
  239. }
  240. textarea#commentInput{
  241. color: #00ff00;
  242. text-color: #00FF00;
  243. font-family: Fantasy;
  244. text-shadow: 3px 3px black;
  245.  
  246. }
  247. #top{
  248. opacity: 0.8;
  249. }
  250. .url.box{
  251. background: url(https://i.pinimg.com/originals/61/f0/de/61f0de8e63452614dcdc7c6aac3fa2ee.gif);
  252. filter: brightness(85%) grayscale(100%) sepia(1000%) hue-rotate(65deg) saturate(450%) contrast(1.5);
  253.  
  254. -webkit-animation-name: shake;
  255. -webkit-transform-origin:50% 50%;
  256. -webkit-animation-timing-function: linear;}
  257.  
  258. #hSub:hover {
  259. margin-left: 10px;
  260. line-height: 25px;
  261. -webkit-animation-name: shake;
  262. -webkit-transform-origin:50% 50%;
  263. -webkit-animation-timing-function: linear;
  264. }
  265.  
  266. #report.boxButton:hover {
  267. margin-left: 10px;
  268. line-height: 25px;
  269. -webkit-animation-name: shake;
  270. -webkit-transform-origin:50% 50%;
  271. -webkit-animation-timing-function: linear;
  272. }
  273. #block.boxButton:hover {
  274. margin-left: 10px;
  275. line-height: 25px;
  276. -webkit-animation-name: shake;
  277. -webkit-transform-origin:50% 50%;
  278. -webkit-animation-timing-function: linear;
  279. }
  280. #add.boxButton:hover {
  281. margin-left: 10px;
  282. line-height: 25px;
  283. -webkit-animation-name: shake;
  284. -webkit-transform-origin:50% 50%;
  285. -webkit-animation-timing-function: linear;
  286. }
  287. #sMsg.boxButton:hover {
  288. margin-left: 10px;
  289. line-height: 25px;
  290. -webkit-animation-name: shake;
  291. -webkit-transform-origin:50% 50%;
  292. -webkit-animation-timing-function: linear;
  293. }
  294. #about:hover {
  295. margin-left: 10px;
  296. line-height: 25px;
  297. -webkit-animation-name: shake;
  298. -webkit-transform-origin:50% 50%;
  299. -webkit-animation-timing-function: linear;
  300. }
  301. #form:hover {
  302. margin-left: 10px;
  303. line-height: 25px;
  304. -webkit-animation-name: shake;
  305. -webkit-transform-origin:50% 50%;
  306. -webkit-animation-timing-function: linear;
  307. }
  308. #userWall:hover {
  309. margin-left: 10px;
  310. line-height: 25px;
  311. -webkit-animation-name: shake;
  312. -webkit-transform-origin:50% 50%;
  313. -webkit-animation-timing-function: linear;
  314. }
  315. #top:hover {
  316. margin-left: 10px;
  317. line-height: 25px;
  318. -webkit-animation-name: shake;
  319. -webkit-transform-origin:50% 50%;
  320. -webkit-animation-timing-function: linear;
  321. }
  322. #container {
  323.  
  324. -webkit-animation-name: shake;
  325. -webkit-animation-duration: 0.9s;
  326. -webkit-transform-origin:50% 50%;
  327. -webkit-animation-iteration-count: infinite;
  328. -webkit-animation-timing-function: linear;
  329. }
  330. #avatar:hover {
  331. margin-left: 10px;
  332. line-height: 25px;
  333. -webkit-animation-name: shake;
  334. -webkit-transform-origin:50% 50%;
  335. -webkit-animation-timing-function: linear;
  336. }
  337. .songName:after {
  338. content: url(https://i.gifer.com/origin/d8/d8f244271a7c56bc9fcb22f80505708c_w200.gif);
  339. }
  340. .shake:hover,
  341. .shake:focus {
  342. -webkit-animation-name: spaceboots;
  343. -webkit-animation-duration: 0.9s;
  344. -webkit-transform-origin:50% 50%;
  345. -webkit-animation-iteration-count: infinite;
  346. -webkit-animation-timing-function: linear;
  347. }
  348. #header{
  349. -webkit-animation-name: shake;
  350. -webkit-animation-duration: 0.9s;
  351. -webkit-transform-origin:50% 50%;
  352. -webkit-animation-iteration-count: infinite;
  353. -webkit-animation-timing-function: linear;;
  354. }
  355. .extended.box{
  356. border: 3px solid #0000;
  357. background-image: url(https://i.pinimg.com/originals/4d/63/cb/4d63cbbd5500eeca274989bb174879bb.gif);
  358. margin-bottom: 30px;
  359. margin-top: 30px;
  360. }
  361.  
  362. .topLeft:after{
  363. content: url(https://thumbs.gfycat.com/QuarterlyDefiniteAmericanwirehair-size_restricted.gif);
  364. opacity: 0.8;
  365. width: 100%;
  366. filter: brightness(85%) grayscale(100%) sepia(1000%) hue-rotate(65deg) saturate(450%) contrast(1.5);
  367. -webkit-animation-name: shake;
  368. -webkit-animation-duration: 0.9s;
  369. -webkit-transform-origin:50% 50%;
  370. -webkit-animation-iteration-count: infinite;
  371. -webkit-animation-timing-function: linear;
  372. }
  373. div#header {
  374. -webkit-animation-name: shake;
  375. -webkit-animation-duration: 0.9s;
  376. -webkit-transform-origin:50% 50%;
  377. -webkit-animation-iteration-count: infinite;
  378. -webkit-animation-timing-function: linear;}
  379. #hUp:hover {
  380. margin-left: 10px;
  381. line-height: 25px;
  382. -webkit-animation-name: shake;
  383. -webkit-transform-origin:50% 50%;
  384. -webkit-animation-timing-function: linear;
  385. }
  386. .fwiendCount:after{
  387. content: "3 L33T";}
  388. .boxHead:after {
  389. content: " (to TH3 L33T B01)";
  390. font-family: Fantasy;
  391. font-size: large;
  392. color: #00BB00;
  393. text-color: #00BB00;}
  394.  
  395. a.logo{
  396. visibility: hidden;
  397. }
  398.  
  399. a.logo:after{
  400. color: #5f5;
  401. text-decoration: line-through;
  402. content:"W3LC0M3 T0 TH3 L33T S1T3";
  403. visibility: visible;
  404. }
  405. #age {
  406. font-size: 0
  407. }
  408. #age::after {
  409. content: "l33t";
  410. font-size: 15px
  411. }
  412. #gender {
  413. font-size: 0
  414. }
  415. #gender::after {
  416. content: "Hacker";
  417. font-size: 15px
  418. }
  419.  
  420. #country {
  421. font-size: 0;
  422. }
  423. #country::after {
  424. content: "Hackerland";
  425. font-size: 15px;
  426. }
  427.  
  428. @keyframes float {
  429. 0% {
  430. transform: translateY(-8%);
  431. }
  432. 50% {
  433. transform: translateY(8%);
  434. }
  435. 100% {
  436. transform: translateY(-8%);
  437. }
  438. }
  439. @media only screen and (min-width: 769px) {
  440. #top>a .fwiendFace {
  441. animation: float 1.5s ease-in-out infinite;
  442. }
  443. }
  444. @keyframes roll{0%{border:4px solid #007722;box-shadow:0 0 2rem #00ff00;}50%{border:2px solid #007722;box-shadow:0 0 2rem #00ff00;}100%{transform:rotate(360deg)}}
  445.  
  446.  
  447. #avatar{border-radius:100%;animation:roll 4s linear infinite;border:4px solid #00ff00;box-shadow:0 0 2rem #000000
  448. }
  449.  
  450. .box.blog {
  451. background-image: url(https://i.pinimg.com/originals/61/f0/de/61f0de8e63452614dcdc7c6aac3fa2ee.gif); }
  452.  
  453. .blogCorpus {
  454. background-image: url(https://i.gifer.com/origin/d8/d8f244271a7c56bc9fcb22f80505708c_w200.gif);
  455. opacity: 0.9;
  456. }
  457.  
  458. .blogs {background-image: url(https://i.pinimg.com/originals/61/f0/de/61f0de8e63452614dcdc7c6aac3fa2ee.gif);
  459. -webkit-animation-name: shake;
  460. -webkit-animation-duration: 0.9s;
  461. -webkit-transform-origin:50% 50%;
  462. -webkit-animation-iteration-count: infinite;
  463. -webkit-animation-timing-function: linear;}
  464. .rightHead::after{
  465. content: url(http://r72.cooltext.com/rendered/cooltext-357143612410240.png);}
  466.  
  467. .fwiendFace{
  468. filter: brightness(85%) grayscale(100%) sepia(1000%) hue-rotate(70deg) saturate(300%) contrast(1.5);
  469. }
  470. .tableLeft{
  471. filter: brightness(85%) grayscale(100%) sepia(1000%) hue-rotate(70deg) saturate(450%) contrast(1.5);
  472. }
  473. input, button {
  474. background-color: black;
  475. color: #00dd00;
  476. border: 1px solid #007700;
  477. font-family: "courier";
  478. }
  479.  
  480. @keyframes wiredB {
  481. 50% {
  482. box-shadow: 0 0 2rem #00FF00;
  483. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!