style_lol.css

   1 @keyframes anim
   2 {
   3   0%   { margin-left: 0px; transform: rotate(6deg); }
   4   50%  { margin-left: 200px; transform: rotate(0deg); }
   5   100% { margin-left: 0px; transform: rotate(-5deg);  }
   6 }
   7
   8 @keyframes anim2
   9 {
  10   0%   { color: red;   font-size: 20px; }
  11   25%  { color: black; font-size: 20px; }
  12   50%  { color: green; font-size: 21px; }
  13   75%  { color: white; font-size: 30px; }
  14   100% { color: blue;  font-size: 20px; }
  15 }
  16
  17 body
  18 {
  19   background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/2/26/Cat_8.jpg/180px-Cat_8.jpg");
  20   cursor: not-allowed;
  21   width: 200%;
  22   transform: skew(3deg);
  23 }
  24
  25 p
  26 {
  27   background-color: red;
  28   font-family: cursive;
  29   transform: rotate(170deg);
  30 }
  31
  32 h1
  33 {
  34   animation-name: anim;
  35   animation-duration: 1s;
  36   animation-iteration-count: infinite;
  37   animation-timing-function: linear;
  38   cursor: zoom-in;
  39   color: brown;
  40 }
  41
  42 h2, h3
  43 {
  44   animation-name: anim2;
  45   animation-duration: 0.1s;
  46   animation-iteration-count: infinite;
  47   animation-timing-function: linear;
  48   background-color: yellow;
  49   cursor: zoom-out;
  50 }
  51
  52 .nav
  53 {
  54   display: block;
  55   transform: perspective(300px);
  56   transform: rotateY(50deg);
  57 }
  58
  59 pre, code
  60 {
  61   font-family: fantasy;
  62   background-color: rgba(255,255,255,0.7);
  63   color: green;
  64   cursor: none;
  65 }
  66
  67 em, i
  68 {
  69   animation-name: anim2;
  70   animation-duration: 2s;
  71   animation-iteration-count: infinite;
  72   animation-timing-function: linear;
  73 }
  74
  75 b, strong
  76 {
  77   color: #00f;
  78   font-family: emoji;
  79 }
  80
  81 h1::before, h2::before, h1::after, h2::after
  82 {
  83   content: '';
  84   background: url("https://upload.wikimedia.org/wikipedia/commons/3/36/Anarcho_pacifism_animation_2.gif?20190915203531");
  85   background-size: cover;
  86   display: inline-block;
  87   width: 64px;
  88   height: 64px;
  89 }
  90
  91 a
  92 {
  93   color: #0f0;
  94   cursor: row-resize;
  95 }
  96
  97 a:hover
  98 {
  99   display: none;
 100 }
 101
 102 p:after
 103 {
 104   content: "😀😁😂😃";
 105 }
 106
 107 p:before
 108 {
 109   content: " 𒐫 𒈙 ﷽";
 110 }