API tools faq
paste
Advertisement
Guest User

Nostalgic CSS Myspace93

a guest
May 30th, 2021
184
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.91 KB | None | 0 0
raw download clone embed print report
  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
Public Pastes
Advertisement
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!