body{background-color: #111111;margin: 0;overflow-x: hidden;}

.centerdiv{text-align: center;padding:50px;user-select: none;}

i{color:#333;padding:10px;transition: color 2s;}

.a:hover{color:#fdd023;}
.r:hover{color:#8C53B4;}
.c:hover{color:#1AD0F6;}
.q:hover{color:#06B97A;}
.t:hover{color:#fff;}

.bg {
  position: fixed;top: -50%;left: -50%;right: -50%;bottom: -50%;width: 200%;height: 200vh;background: transparent url('http://assets.iceable.com/img/noise-transparent.png') repeat 0 0;  background-repeat: repeat;animation: bg-animation .2s infinite;opacity: .9;visibility: visible;z-index: -1;}

@keyframes bg-animation {
    0% { transform: translate(0,0) }
    10% { transform: translate(-5%,-5%) }
    20% { transform: translate(-10%,5%) }
    30% { transform: translate(5%,-10%) }
    40% { transform: translate(-5%,15%) }
    50% { transform: translate(-10%,5%) }
    60% { transform: translate(15%,0) }
    70% { transform: translate(0,10%) }
    80% { transform: translate(-15%,0) }
    90% { transform: translate(10%,5%) }
    100% { transform: translate(5%,0) }
}