Advertisement
Guest User

Nostalgic CSS Myspace93

a guest
May 30th, 2021
130
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.91 KB | None | 0 0
  1. body {
  2. background-image: url("https://store-images.s-microsoft.com/image/apps.11118.13819498107583324.b370e0fc-6f1c-4431-9923-73bcfbf646a5.eacf115f-f4af-47ed-a713-43ebb75e5ae3");
  3. font-family: "Times New Roman";
  4. color: white;
  5. }
  6.  
  7. h2#name.uName {
  8. -webkit-animation: shake-bottom 10s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;
  9. animation: shake-bottom 10s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;
  10. text-align: center;
  11. background-color: red;
  12. text-transform: uppercase;
  13. font-family: "Comic Sans MS";
  14. text-shadow: 2px 2px 0px blue;
  15. border-box: double;
  16. border-block: double yellow;
  17. }
  18.  
  19. td.shortRight {
  20. border: 3px dashed orange;
  21. }
  22.  
  23. /* ----------------------------------------------
  24.  * Generated by Animista on 2021-5-27 18:45:59
  25.  * Licensed under FreeBSD License.
  26.  * See http://animista.net/license for more info.
  27.  * w: http://animista.net, t: @cssanimista
  28.  * ---------------------------------------------- */
  29.  
  30. /**
  31.  * ----------------------------------------
  32.  * animation shake-bottom
  33.  * ----------------------------------------
  34.  */
  35. @-webkit-keyframes shake-bottom {
  36.   0%,
  37.   100% {
  38.     -webkit-transform: rotate(0deg);
  39.             transform: rotate(0deg);
  40.     -webkit-transform-origin: 50% 100%;
  41.             transform-origin: 50% 100%;
  42.   }
  43.   10% {
  44.     -webkit-transform: rotate(2deg);
  45.             transform: rotate(2deg);
  46.   }
  47.   20%,
  48.   40%,
  49.   60% {
  50.     -webkit-transform: rotate(-4deg);
  51.             transform: rotate(-4deg);
  52.   }
  53.   30%,
  54.   50%,
  55.   70% {
  56.     -webkit-transform: rotate(4deg);
  57.             transform: rotate(4deg);
  58.   }
  59.   80% {
  60.     -webkit-transform: rotate(-2deg);
  61.             transform: rotate(-2deg);
  62.   }
  63.   90% {
  64.     -webkit-transform: rotate(2deg);
  65.             transform: rotate(2deg);
  66.   }
  67. }
  68. @keyframes shake-bottom {
  69.   0%,
  70.   100% {
  71.     -webkit-transform: rotate(0deg);
  72.             transform: rotate(0deg);
  73.     -webkit-transform-origin: 50% 100%;
  74.             transform-origin: 50% 100%;
  75.   }
  76.   10% {
  77.     -webkit-transform: rotate(2deg);
  78.             transform: rotate(2deg);
  79.   }
  80.   20%,
  81.   40%,
  82.   60% {
  83.     -webkit-transform: rotate(-4deg);
  84.             transform: rotate(-4deg);
  85.   }
  86.   30%,
  87.   50%,
  88.   70% {
  89.     -webkit-transform: rotate(4deg);
  90.             transform: rotate(4deg);
  91.   }
  92.   80% {
  93.     -webkit-transform: rotate(-2deg);
  94.             transform: rotate(-2deg);
  95.   }
  96.   90% {
  97.     -webkit-transform: rotate(2deg);
  98.             transform: rotate(2deg);
  99.   }
  100. }
  101.  
  102. div.boxInfo.box {
  103. -webkit-animation: bounce-in-left 1.1s both;
  104. animation: bounce-in-left 1.1s both;
  105. }
  106.  
  107. /* ----------------------------------------------
  108.  * Generated by Animista on 2021-5-28 7:44:7
  109.  * Licensed under FreeBSD License.
  110.  * See http://animista.net/license for more info.
  111.  * w: http://animista.net, t: @cssanimista
  112.  * ---------------------------------------------- */
  113.  
  114. /**
  115.  * ----------------------------------------
  116.  * animation bounce-in-left
  117.  * ----------------------------------------
  118.  */
  119. @-webkit-keyframes bounce-in-left {
  120.   0% {
  121.     -webkit-transform: translateX(-600px);
  122.             transform: translateX(-600px);
  123.     -webkit-animation-timing-function: ease-in;
  124.             animation-timing-function: ease-in;
  125.     opacity: 0;
  126.   }
  127.   38% {
  128.     -webkit-transform: translateX(0);
  129.             transform: translateX(0);
  130.     -webkit-animation-timing-function: ease-out;
  131.             animation-timing-function: ease-out;
  132.     opacity: 1;
  133.   }
  134.   55% {
  135.     -webkit-transform: translateX(-68px);
  136.             transform: translateX(-68px);
  137.     -webkit-animation-timing-function: ease-in;
  138.             animation-timing-function: ease-in;
  139.   }
  140.   72% {
  141.     -webkit-transform: translateX(0);
  142.             transform: translateX(0);
  143.     -webkit-animation-timing-function: ease-out;
  144.             animation-timing-function: ease-out;
  145.   }
  146.   81% {
  147.     -webkit-transform: translateX(-28px);
  148.             transform: translateX(-28px);
  149.     -webkit-animation-timing-function: ease-in;
  150.             animation-timing-function: ease-in;
  151.   }
  152.   90% {
  153.     -webkit-transform: translateX(0);
  154.             transform: translateX(0);
  155.     -webkit-animation-timing-function: ease-out;
  156.             animation-timing-function: ease-out;
  157.   }
  158.   95% {
  159.     -webkit-transform: translateX(-8px);
  160.             transform: translateX(-8px);
  161.     -webkit-animation-timing-function: ease-in;
  162.             animation-timing-function: ease-in;
  163.   }
  164.   100% {
  165.     -webkit-transform: translateX(0);
  166.             transform: translateX(0);
  167.     -webkit-animation-timing-function: ease-out;
  168.             animation-timing-function: ease-out;
  169.   }
  170. }
  171. @keyframes bounce-in-left {
  172.   0% {
  173.     -webkit-transform: translateX(-600px);
  174.             transform: translateX(-600px);
  175.     -webkit-animation-timing-function: ease-in;
  176.             animation-timing-function: ease-in;
  177.     opacity: 0;
  178.   }
  179.   38% {
  180.     -webkit-transform: translateX(0);
  181.             transform: translateX(0);
  182.     -webkit-animation-timing-function: ease-out;
  183.             animation-timing-function: ease-out;
  184.     opacity: 1;
  185.   }
  186.   55% {
  187.     -webkit-transform: translateX(-68px);
  188.             transform: translateX(-68px);
  189.     -webkit-animation-timing-function: ease-in;
  190.             animation-timing-function: ease-in;
  191.   }
  192.   72% {
  193.     -webkit-transform: translateX(0);
  194.             transform: translateX(0);
  195.     -webkit-animation-timing-function: ease-out;
  196.             animation-timing-function: ease-out;
  197.   }
  198.   81% {
  199.     -webkit-transform: translateX(-28px);
  200.             transform: translateX(-28px);
  201.     -webkit-animation-timing-function: ease-in;
  202.             animation-timing-function: ease-in;
  203.   }
  204.   90% {
  205.     -webkit-transform: translateX(0);
  206.             transform: translateX(0);
  207.     -webkit-animation-timing-function: ease-out;
  208.             animation-timing-function: ease-out;
  209.   }
  210.   95% {
  211.     -webkit-transform: translateX(-8px);
  212.             transform: translateX(-8px);
  213.     -webkit-animation-timing-function: ease-in;
  214.             animation-timing-function: ease-in;
  215.   }
  216.   100% {
  217.     -webkit-transform: translateX(0);
  218.             transform: translateX(0);
  219.     -webkit-animation-timing-function: ease-out;
  220.             animation-timing-function: ease-out;
  221.   }
  222. }
  223.  
  224. .boxHead {
  225.     background: pink;
  226.     color: black;
  227.     padding: 3px;
  228.         padding-bottom: 3px;
  229.         padding-left: 3px;
  230.     padding-bottom: 4px;
  231.     padding-left: 6px;
  232. text-shadow: 2px 2px 0px white;
  233. font-family: "Verdana";
  234. }
  235.  
  236. div.url.box {
  237. background-image: url("https://www.cameronsworld.net/img/content/18/bg.png");
  238. }
  239.  
  240. div.blogs a {
  241.     background-color: lightgray;
  242.     border: 3px outset white;
  243. color: green;
  244. text-decoration: none;
  245. text-transform: capitalize;
  246. }
  247.  
  248. div.extended.box {
  249.     -webkit-animation: vibrate-1 0.3s linear infinite both;
  250.             animation: vibrate-1 0.3s linear infinite both;
  251. border: 3px inset purple;
  252. }
  253.  
  254. /* ----------------------------------------------
  255.  * Generated by Animista on 2021-5-28 8:7:7
  256.  * Licensed under FreeBSD License.
  257.  * See http://animista.net/license for more info.
  258.  * w: http://animista.net, t: @cssanimista
  259.  * ---------------------------------------------- */
  260.  
  261. /**
  262.  * ----------------------------------------
  263.  * animation vibrate-1
  264.  * ----------------------------------------
  265.  */
  266. @-webkit-keyframes vibrate-1 {
  267.   0% {
  268.     -webkit-transform: translate(0);
  269.             transform: translate(0);
  270.   }
  271.   20% {
  272.     -webkit-transform: translate(-2px, 2px);
  273.             transform: translate(-2px, 2px);
  274.   }
  275.   40% {
  276.     -webkit-transform: translate(-2px, -2px);
  277.             transform: translate(-2px, -2px);
  278.   }
  279.   60% {
  280.     -webkit-transform: translate(2px, 2px);
  281.             transform: translate(2px, 2px);
  282.   }
  283.   80% {
  284.     -webkit-transform: translate(2px, -2px);
  285.             transform: translate(2px, -2px);
  286.   }
  287.   100% {
  288.     -webkit-transform: translate(0);
  289.             transform: translate(0);
  290.   }
  291. }
  292. @keyframes vibrate-1 {
  293.   0% {
  294.     -webkit-transform: translate(0);
  295.             transform: translate(0);
  296.   }
  297.   20% {
  298.     -webkit-transform: translate(-2px, 2px);
  299.             transform: translate(-2px, 2px);
  300.   }
  301.   40% {
  302.     -webkit-transform: translate(-2px, -2px);
  303.             transform: translate(-2px, -2px);
  304.   }
  305.   60% {
  306.     -webkit-transform: translate(2px, 2px);
  307.             transform: translate(2px, 2px);
  308.   }
  309.   80% {
  310.     -webkit-transform: translate(2px, -2px);
  311.             transform: translate(2px, -2px);
  312.   }
  313.   100% {
  314.     -webkit-transform: translate(0);
  315.             transform: translate(0);
  316.   }
  317. }
  318.  
  319. div.rightHead {
  320.     -webkit-animation: color-change-3x 4s linear infinite alternate both;
  321.             animation: color-change-3x 4s linear infinite alternate both;
  322. color: white;
  323. font-family: "Arial";
  324. }
  325.  
  326. /* ----------------------------------------------
  327.  * Generated by Animista on 2021-5-28 8:9:52
  328.  * Licensed under FreeBSD License.
  329.  * See http://animista.net/license for more info.
  330.  * w: http://animista.net, t: @cssanimista
  331.  * ---------------------------------------------- */
  332.  
  333. /**
  334.  * ----------------------------------------
  335.  * animation color-change-3x
  336.  * ----------------------------------------
  337.  */
  338. @-webkit-keyframes color-change-3x {
  339.   0% {
  340.     background: #19dcea;
  341.   }
  342.   50% {
  343.     background: #b22cff;
  344.   }
  345.   100% {
  346.     background: #ea2222;
  347.   }
  348. }
  349. @keyframes color-change-3x {
  350.   0% {
  351.     background: #19dcea;
  352.   }
  353.   50% {
  354.     background: #b22cff;
  355.   }
  356.   100% {
  357.     background: #ea2222;
  358.   }
  359. }
  360.  
  361. h4 {
  362. font-family: "Comic Sans MS";
  363. color: lime;
  364. }
  365.  
  366. td.tableLeft {
  367. background-image: url("https://www.cameronsworld.net/img/content/14/bg.png");
  368. font-family: "Verdana";
  369. }
  370.  
  371. td.tableRight {
  372. background-image: url("https://www.cameronsworld.net/img/content/20/bg.png");
  373. font-family: "Comic Sans MS";
  374. }
  375.  
  376. div.box.blog a {
  377. border: none;
  378. background-color: none;
  379. color: red;
  380. }
  381.  
  382. a small {
  383. background-image: url("https://www.cameronsworld.net/img/content/26/bg.png");
  384. border: none;
  385. }
  386.  
  387. div.box.blog {
  388. background-image: url("https://www.cameronsworld.net/img/content/26/bg.png");
  389. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement