API tools faq
paste
gavin19

htm

gavin19
Aug 11th, 2014
268
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 14.06 KB | None | 0 0
raw download clone embed print report
  1. .thing[data-fullname$="t"] .arrow.upmod:focus:after, .thing[data-fullname$="b"] .arrow.upmod:focus:after {
  2.     content: "Awesome!";
  3.     font-size: 12px;
  4.     font-weight: bold;
  5.     margin-left: -8px;
  6.     position: relative;
  7.     color: orangered;
  8.     bottom: 10px;
  9.     opacity: 0;
  10.     -webkit-animation: tagged 1.5s ease-out;
  11.     animation: tagged 1.5s ease-out;
  12. }
  13. @-webkit-keyframes tagged {
  14.     0% { color: #FF0000; }
  15.     8% { bottom: 23px; opacity: 1; }
  16.     15% { bottom: 28px; }
  17.     50% { color: orangered; bottom: 33px;}
  18.     100% { bottom: 38px; opacity: 0}
  19. }
  20. @keyframes tagged {
  21.     0% { color: #FF0000; }
  22.     8% { bottom: 23px; opacity: 1; }
  23.     15% { bottom: 28px; }
  24.     50% { color: orangered; bottom: 33px;}
  25.     100% { bottom: 38px; opacity: 0}
  26. }
  27.  
  28. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  29.  
  30. .thing[data-fullname$="u"] .arrow.upmod:focus:after, .thing[data-fullname$="c"] .arrow.upmod:focus:after {
  31.     content: "Great!";
  32.     font-size: 12px;
  33.     font-weight: bold;
  34.     margin-left: -8px;
  35.     position: relative;
  36.     color: orangered;
  37.     bottom: 10px;
  38.     opacity: 0;
  39.     -webkit-animation: tagged 1.5s ease-out;
  40.     animation: tagged 1.5s ease-out;
  41. }
  42. @-webkit-keyframes tagged {
  43.     0% { color: #FF0000; }
  44.     8% { bottom: 23px; opacity: 1; }
  45.     15% { bottom: 28px; }
  46.     50% { color: orangered; bottom: 33px;}
  47.     100% { bottom: 38px; opacity: 0}
  48. }
  49. @keyframes tagged {
  50.     0% { color: #FF0000; }
  51.     8% { bottom: 23px; opacity: 1; }
  52.     15% { bottom: 28px; }
  53.     50% { color: orangered; bottom: 33px;}
  54.     100% { bottom: 38px; opacity: 0}
  55. }
  56.  
  57. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  58.  
  59. .thing[data-fullname$="v"] .arrow.upmod:focus:after, .thing[data-fullname$="d"] .arrow.upmod:focus:after {
  60.     content: "Yes!";
  61.     font-size: 12px;
  62.     font-weight: bold;
  63.     margin-left: -8px;
  64.     position: relative;
  65.     color: orangered;
  66.     bottom: 10px;
  67.     opacity: 0;
  68.     -webkit-animation: tagged 1.5s ease-out;
  69.     animation: tagged 1.5s ease-out;
  70. }
  71. @-webkit-keyframes tagged {
  72.     0% { color: #FF0000; }
  73.     8% { bottom: 23px; opacity: 1; }
  74.     15% { bottom: 28px; }
  75.     50% { color: orangered; bottom: 33px;}
  76.     100% { bottom: 38px; opacity: 0}
  77. }
  78. @keyframes tagged {
  79.     0% { color: #FF0000; }
  80.     8% { bottom: 23px; opacity: 1; }
  81.     15% { bottom: 28px; }
  82.     50% { color: orangered; bottom: 33px;}
  83.     100% { bottom: 38px; opacity: 0}
  84. }
  85.  
  86. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  87.  
  88. .thing[data-fullname$="w"] .arrow.upmod:focus:after, .thing[data-fullname$="e"] .arrow.upmod:focus:after {
  89.     content: "Brilliant!";
  90.     font-size: 12px;
  91.     font-weight: bold;
  92.     margin-left: -8px;
  93.     position: relative;
  94.     color: orangered;
  95.     bottom: 10px;
  96.     opacity: 0;
  97.     -webkit-animation: tagged 1.5s ease-out;
  98.     animation: tagged 1.5s ease-out;
  99. }
  100. @-webkit-keyframes tagged {
  101.     0% { color: #FF0000; }
  102.     8% { bottom: 23px; opacity: 1; }
  103.     15% { bottom: 28px; }
  104.     50% { color: orangered; bottom: 33px;}
  105.     100% { bottom: 38px; opacity: 0}
  106. }
  107. @keyframes tagged {
  108.     0% { color: #FF0000; }
  109.     8% { bottom: 23px; opacity: 1; }
  110.     15% { bottom: 28px; }
  111.     50% { color: orangered; bottom: 33px;}
  112.     100% { bottom: 38px; opacity: 0}
  113. }
  114.  
  115. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  116.  
  117. .thing[data-fullname$="x"] .arrow.upmod:focus:after, .thing[data-fullname$="f"] .arrow.upmod:focus:after {
  118.     content: "Wicked!";
  119.     font-size: 12px;
  120.     font-weight: bold;
  121.     margin-left: -8px;
  122.     position: relative;
  123.     color: orangered;
  124.     bottom: 10px;
  125.     opacity: 0;
  126.     -webkit-animation: tagged 1.5s ease-out;
  127.     animation: tagged 1.5s ease-out;
  128. }
  129. @-webkit-keyframes tagged {
  130.     0% { color: #FF0000; }
  131.     8% { bottom: 23px; opacity: 1; }
  132.     15% { bottom: 28px; }
  133.     50% { color: orangered; bottom: 33px;}
  134.     100% { bottom: 38px; opacity: 0}
  135. }
  136. @keyframes tagged {
  137.     0% { color: #FF0000; }
  138.     8% { bottom: 23px; opacity: 1; }
  139.     15% { bottom: 28px; }
  140.     50% { color: orangered; bottom: 33px;}
  141.     100% { bottom: 38px; opacity: 0}
  142. }
  143.  
  144. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  145.  
  146. .thing[data-fullname$="y"] .arrow.upmod:focus:after, .thing[data-fullname$="g"] .arrow.upmod:focus:after {
  147.     content: "Neat!";
  148.     font-size: 12px;
  149.     font-weight: bold;
  150.     margin-left: -8px;
  151.     position: relative;
  152.     color: orangered;
  153.     bottom: 10px;
  154.     opacity: 0;
  155.     -webkit-animation: tagged 1.5s ease-out;
  156.     animation: tagged 1.5s ease-out;
  157. }
  158. @-webkit-keyframes tagged {
  159.     0% { color: #FF0000; }
  160.     8% { bottom: 23px; opacity: 1; }
  161.     15% { bottom: 28px; }
  162.     50% { color: orangered; bottom: 33px;}
  163.     100% { bottom: 38px; opacity: 0}
  164. }
  165. @keyframes tagged {
  166.     0% { color: #FF0000; }
  167.     8% { bottom: 23px; opacity: 1; }
  168.     15% { bottom: 28px; }
  169.     50% { color: orangered; bottom: 33px;}
  170.     100% { bottom: 38px; opacity: 0}
  171. }
  172.  
  173. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  174.  
  175. .thing[data-fullname$="z"] .arrow.upmod:focus:after, .thing[data-fullname$="h"] .arrow.upmod:focus:after {
  176.     content: "Sweet!";
  177.     font-size: 12px;
  178.     font-weight: bold;
  179.     margin-left: -8px;
  180.     position: relative;
  181.     color: orangered;
  182.     bottom: 10px;
  183.     opacity: 0;
  184.     -webkit-animation: tagged 1.5s ease-out;
  185.     animation: tagged 1.5s ease-out;
  186. }
  187. @-webkit-keyframes tagged {
  188.     0% { color: #FF0000; }
  189.     8% { bottom: 23px; opacity: 1; }
  190.     15% { bottom: 28px; }
  191.     50% { color: orangered; bottom: 33px;}
  192.     100% { bottom: 38px; opacity: 0}
  193. }
  194. @keyframes tagged {
  195.     0% { color: #FF0000; }
  196.     8% { bottom: 23px; opacity: 1; }
  197.     15% { bottom: 28px; }
  198.     50% { color: orangered; bottom: 33px;}
  199.     100% { bottom: 38px; opacity: 0}
  200. }
  201.  
  202. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  203.  
  204. .thing[data-fullname$="0"] .arrow.upmod:focus:after, .thing[data-fullname$="i"] .arrow.upmod:focus:after {
  205.     content: "Wow!";
  206.     font-size: 12px;
  207.     font-weight: bold;
  208.     margin-left: -8px;
  209.     position: relative;
  210.     color: orangered;
  211.     bottom: 10px;
  212.     opacity: 0;
  213.     -webkit-animation: tagged 1.5s ease-out;
  214.     animation: tagged 1.5s ease-out;
  215. }
  216. @-webkit-keyframes tagged {
  217.     0% { color: #FF0000; }
  218.     8% { bottom: 23px; opacity: 1; }
  219.     15% { bottom: 28px; }
  220.     50% { color: orangered; bottom: 33px;}
  221.     100% { bottom: 38px; opacity: 0}
  222. }
  223. @keyframes tagged {
  224.     0% { color: #FF0000; }
  225.     8% { bottom: 23px; opacity: 1; }
  226.     15% { bottom: 28px; }
  227.     50% { color: orangered; bottom: 33px;}
  228.     100% { bottom: 38px; opacity: 0}
  229. }
  230.  
  231. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  232.  
  233. .thing[data-fullname$="1"] .arrow.upmod:focus:after, .thing[data-fullname$="j"] .arrow.upmod:focus:after {
  234.     content: "Cool!";
  235.     font-size: 12px;
  236.     font-weight: bold;
  237.     margin-left: -8px;
  238.     position: relative;
  239.     color: orangered;
  240.     bottom: 10px;
  241.     opacity: 0;
  242.     -webkit-animation: tagged 1.5s ease-out;
  243.     animation: tagged 1.5s ease-out;
  244. }
  245. @-webkit-keyframes tagged {
  246.     0% { color: #FF0000; }
  247.     8% { bottom: 23px; opacity: 1; }
  248.     15% { bottom: 28px; }
  249.     50% { color: orangered; bottom: 33px;}
  250.     100% { bottom: 38px; opacity: 0}
  251. }
  252. @keyframes tagged {
  253.     0% { color: #FF0000; }
  254.     8% { bottom: 23px; opacity: 1; }
  255.     15% { bottom: 28px; }
  256.     50% { color: orangered; bottom: 33px;}
  257.     100% { bottom: 38px; opacity: 0}
  258. }
  259.  
  260. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  261.  
  262. .thing[data-fullname$="2"] .arrow.upmod:focus:after, .thing[data-fullname$="k"] .arrow.upmod:focus:after {
  263.     content: "Amazing!";
  264.     font-size: 12px;
  265.     font-weight: bold;
  266.     margin-left: -8px;
  267.     position: relative;
  268.     color: orangered;
  269.     bottom: 10px;
  270.     opacity: 0;
  271.     -webkit-animation: tagged 1.5s ease-out;
  272.     animation: tagged 1.5s ease-out;
  273. }
  274. @-webkit-keyframes tagged {
  275.     0% { color: #FF0000; }
  276.     8% { bottom: 23px; opacity: 1; }
  277.     15% { bottom: 28px; }
  278.     50% { color: orangered; bottom: 33px;}
  279.     100% { bottom: 38px; opacity: 0}
  280. }
  281. @keyframes tagged {
  282.     0% { color: #FF0000; }
  283.     8% { bottom: 23px; opacity: 1; }
  284.     15% { bottom: 28px; }
  285.     50% { color: orangered; bottom: 33px;}
  286.     100% { bottom: 38px; opacity: 0}
  287. }
  288.  
  289. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  290.  
  291. .thing[data-fullname$="3"] .arrow.upmod:focus:after, .thing[data-fullname$="l"] .arrow.upmod:focus:after {
  292.     content: "Excellent!";
  293.     font-size: 12px;
  294.     font-weight: bold;
  295.     margin-left: -8px;
  296.     position: relative;
  297.     color: orangered;
  298.     bottom: 10px;
  299.     opacity: 0;
  300.     -webkit-animation: tagged 1.5s ease-out;
  301.     animation: tagged 1.5s ease-out;
  302. }
  303. @-webkit-keyframes tagged {
  304.     0% { color: #FF0000; }
  305.     8% { bottom: 23px; opacity: 1; }
  306.     15% { bottom: 28px; }
  307.     50% { color: orangered; bottom: 33px;}
  308.     100% { bottom: 38px; opacity: 0}
  309. }
  310. @keyframes tagged {
  311.     0% { color: #FF0000; }
  312.     8% { bottom: 23px; opacity: 1; }
  313.     15% { bottom: 28px; }
  314.     50% { color: orangered; bottom: 33px;}
  315.     100% { bottom: 38px; opacity: 0}
  316. }
  317.  
  318. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  319.  
  320. .thing[data-fullname$="4"] .arrow.upmod:focus:after, .thing[data-fullname$="m"] .arrow.upmod:focus:after {
  321.     content: "Tight!";
  322.     font-size: 12px;
  323.     font-weight: bold;
  324.     margin-left: -8px;
  325.     position: relative;
  326.     color: orangered;
  327.     bottom: 10px;
  328.     opacity: 0;
  329.     -webkit-animation: tagged 1.5s ease-out;
  330.     animation: tagged 1.5s ease-out;
  331. }
  332. @-webkit-keyframes tagged {
  333.     0% { color: #FF0000; }
  334.     8% { bottom: 23px; opacity: 1; }
  335.     15% { bottom: 28px; }
  336.     50% { color: orangered; bottom: 33px;}
  337.     100% { bottom: 38px; opacity: 0}
  338. }
  339. @keyframes tagged {
  340.     0% { color: #FF0000; }
  341.     8% { bottom: 23px; opacity: 1; }
  342.     15% { bottom: 28px; }
  343.     50% { color: orangered; bottom: 33px;}
  344.     100% { bottom: 38px; opacity: 0}
  345. }
  346.  
  347. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  348.  
  349. .thing[data-fullname$="5"] .arrow.upmod:focus:after, .thing[data-fullname$="n"] .arrow.upmod:focus:after {
  350.     content: "Superb!";
  351.     font-size: 12px;
  352.     font-weight: bold;
  353.     margin-left: -8px;
  354.     position: relative;
  355.     color: orangered;
  356.     bottom: 10px;
  357.     opacity: 0;
  358.     -webkit-animation: tagged 1.5s ease-out;
  359.     animation: tagged 1.5s ease-out;
  360. }
  361. @-webkit-keyframes tagged {
  362.     0% { color: #FF0000; }
  363.     8% { bottom: 23px; opacity: 1; }
  364.     15% { bottom: 28px; }
  365.     50% { color: orangered; bottom: 33px;}
  366.     100% { bottom: 38px; opacity: 0}
  367. }
  368. @keyframes tagged {
  369.     0% { color: #FF0000; }
  370.     8% { bottom: 23px; opacity: 1; }
  371.     15% { bottom: 28px; }
  372.     50% { color: orangered; bottom: 33px;}
  373.     100% { bottom: 38px; opacity: 0}
  374. }
  375.  
  376. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  377.  
  378. .thing[data-fullname$="6"] .arrow.upmod:focus:after, .thing[data-fullname$="o"] .arrow.upmod:focus:after {
  379.     content: "Sublime!";
  380.     font-size: 12px;
  381.     font-weight: bold;
  382.     margin-left: -8px;
  383.     position: relative;
  384.     color: orangered;
  385.     bottom: 10px;
  386.     opacity: 0;
  387.     -webkit-animation: tagged 1.5s ease-out;
  388.     animation: tagged 1.5s ease-out;
  389. }
  390. @-webkit-keyframes tagged {
  391.     0% { color: #FF0000; }
  392.     8% { bottom: 23px; opacity: 1; }
  393.     15% { bottom: 28px; }
  394.     50% { color: orangered; bottom: 33px;}
  395.     100% { bottom: 38px; opacity: 0}
  396. }
  397. @keyframes tagged {
  398.     0% { color: #FF0000; }
  399.     8% { bottom: 23px; opacity: 1; }
  400.     15% { bottom: 28px; }
  401.     50% { color: orangered; bottom: 33px;}
  402.     100% { bottom: 38px; opacity: 0}
  403. }
  404.  
  405. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  406.  
  407. .thing[data-fullname$="7"] .arrow.upmod:focus:after, .thing[data-fullname$="p"] .arrow.upmod:focus:after {
  408.     content: "Beast!";
  409.     font-size: 12px;
  410.     font-weight: bold;
  411.     margin-left: -8px;
  412.     position: relative;
  413.     color: orangered;
  414.     bottom: 10px;
  415.     opacity: 0;
  416.     -webkit-animation: tagged 1.5s ease-out;
  417.     animation: tagged 1.5s ease-out;
  418. }
  419. @-webkit-keyframes tagged {
  420.     0% { color: #FF0000; }
  421.     8% { bottom: 23px; opacity: 1; }
  422.     15% { bottom: 28px; }
  423.     50% { color: orangered; bottom: 33px;}
  424.     100% { bottom: 38px; opacity: 0}
  425. }
  426. @keyframes tagged {
  427.     0% { color: #FF0000; }
  428.     8% { bottom: 23px; opacity: 1; }
  429.     15% { bottom: 28px; }
  430.     50% { color: orangered; bottom: 33px;}
  431.     100% { bottom: 38px; opacity: 0}
  432. }
  433.  
  434. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  435.  
  436. .thing[data-fullname$="8"] .arrow.upmod:focus:after, .thing[data-fullname$="q"] .arrow.upmod:focus:after {
  437.     content: "Groovy!";
  438.     font-size: 12px;
  439.     font-weight: bold;
  440.     margin-left: -8px;
  441.     position: relative;
  442.     color: orangered;
  443.     bottom: 10px;
  444.     opacity: 0;
  445.     -webkit-animation: tagged 1.5s ease-out;
  446.     animation: tagged 1.5s ease-out;
  447. }
  448. @-webkit-keyframes tagged {
  449.     0% { color: #FF0000; }
  450.     8% { bottom: 23px; opacity: 1; }
  451.     15% { bottom: 28px; }
  452.     50% { color: orangered; bottom: 33px;}
  453.     100% { bottom: 38px; opacity: 0}
  454. }
  455. @keyframes tagged {
  456.     0% { color: #FF0000; }
  457.     8% { bottom: 23px; opacity: 1; }
  458.     15% { bottom: 28px; }
  459.     50% { color: orangered; bottom: 33px;}
  460.     100% { bottom: 38px; opacity: 0}
  461. }
  462.  
  463. /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
  464.  
  465. .thing[data-fullname$="9"] .arrow.upmod:focus:after, .thing[data-fullname$="r"] .arrow.upmod:focus:after {
  466.     content: "Stellar!";
  467.     font-size: 12px;
  468.     font-weight: bold;
  469.     margin-left: -8px;
  470.     position: relative;
  471.     color: orangered;
  472.     bottom: 10px;
  473.     opacity: 0;
  474.     -webkit-animation: tagged 1.5s ease-out;
  475.     animation: tagged 1.5s ease-out;
  476. }
  477. @-webkit-keyframes tagged {
  478.     0% { color: #FF0000; }
  479.     8% { bottom: 23px; opacity: 1; }
  480.     15% { bottom: 28px; }
  481.     50% { color: orangered; bottom: 33px;}
  482.     100% { bottom: 38px; opacity: 0}
  483. }
  484. @keyframes tagged {
  485.     0% { color: #FF0000; }
  486.     8% { bottom: 23px; opacity: 1; }
  487.     15% { bottom: 28px; }
  488.     50% { color: orangered; bottom: 33px;}
  489.     100% { bottom: 38px; opacity: 0}
  490. }
Advertisement
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!