this is just a place where I put pieces of code for mby later use or some I already use *thumbs up* 

sooo yeah this is like a forever WIP 

Oh and remember to put it within the <style> </style> thingies if you use any of these :D

SANTA HAT:

.general-about{
  position: relative;
  margin-top: 30px;
}
.general-about .profile-pic::before{
  content: '';
  background: url('https://media.giphy.com/media/rXyIg5TrQ3jYuZME1G/giphy.gif') no-repeat;
  background-size: cover;
  display: block;
  width: 100px;
  height: 100px;
  z-index: 999;
  position: absolute;
  top: -43px;
  left: -32px;
}

SPINNING PFP:

@keyframes spin{

  from{ transform:rotate(0deg); }
  to{ transform:rotate(-360deg); }
}
.general-about .profile-pic img{
  border-radius: 50%;
  animation: spin 5s infinite linear;
}

CHANGING THE CONTACT ICONS:
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: "👁️‍🗨️"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "♠️"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "💬"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* forward to friend*/
content: "🎸"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "🧨"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "🩸"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "📕"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "🔍"

}

ADD NEW INTERESTS TO THE "YOUR INTERESTS" SECTION:
<tr>

  <td>
    <p>NAME OF INTEREST HERE</p>
  </td>
  <td>
    <p>

CONTENT OF INTEREST HERE

</p>

SANTA-SLEIGH FLOATING ACROSS SCREEN:

<style>
@keyframes flying-santa{
  from{ left:-400px; }
  to{ left:calc(100% + 20px); }
}
#santa{
  position: fixed;
  left: -400px;
  top: 200px;
  width: 200px;
  animation: flying-santa 7s infinite linear;
  pointer-events: none;
}
</style>
<img id="santa" aria-hidden="true" src="https://static.spacehey.net/img/special/santa-sleigh.svg"/>