.logo{
      font-size:0;
}

.logo::after{
    content:"AWESOME";
    text-shadow: 2px 2px 4px blue;
    color: white;
    line-height: 10px;
    font-size: 35px;
    padding: 70px;
}

div#header {
    background-color: gray;
    background-position: 0px -400px;
    font-family: "impact";
    background-size: 30%;
    background-repeat: repeat;
    
    
}

div#hSub {
    color: black !important;
    background-color: gray;
    text-align: right;
    font-family: "impact";
}

.extended.box {
    border: 2px solid white;
    background-color: #730000;
}

h4 {
    color: blue;
}

body {
    color: white;
    background-color: blue;
    background-image: url(https://i.imgur.com/xZzdSAj.png);
    font-family: "impact";
    background-size: 30%
}


.player.box {
    background-color: blue;
    background-size: 33%;
    background-position: 150px;
    color: white;
}

.boxInfo.box {
    border-color: #ffffff00;
}

.topLeft{
    margin-top: 20px;
    background-repeat: no-repeat;
    background-color: black;
    background-size: 100% 100%;
    background-image: url(https://i.imgur.com/xZzdSAj.png);
    box-sizing: border-box;
}
 
 
.topRight{
    margin-top: 20px;
    background: url(https://i.imgur.com/xZzdSAj.png);
    margin-bottom: 20px;
    border: 2px solid red;
    background-size: 40%
} 
  

.fwiendCount {
    color: blue;
}
.boxHead{
    color: #FFF;
    background: gray;
    
}

.rightHead{
    color: #FFF;
    background: gray;
    
}

div#footer{
     bottom:0;
     font-size:0;
     left:500px;
     position:fixed;
     pointer-events: none;
 
} 

.fwiendFace, .tableLeft {
    transition: 0.5s;
    background: #ffffff00;
}

.box.blog {
    background: #730000;
}

#sMsg, #block, #report, #add, #remove {
    color: white;
    background-image: url(https://i.imgur.com/xZzdSAj.png);
    background-size: 40%;
}

a {
    color: blue;
}


::selection { background: #ff000050; }

.blinkYellow, .blinkViolet {
    animation:blinkingTextRed 0.3s infinite;
}

.blinkGreen{
	animation:blinkingTextWhite 0.3s infinite;
}

@keyframes blinkingTextWhite {
0% {
    color: black;
}

49% {
    color: white;
}
50% {
    color: white;
}
99% {
    color: white;
}
100% {
    color: black;
}
}

@keyframes shake{
    0% {
        transform:translate(1px,1px) rotate(0deg);
    }
 
    10% {
        transform:translate(-1px,-2px) rotate(-1deg);
    }
 
    20% {
        transform:translate(-3px,0px) rotate(1deg);
    }
 
    30% {
        transform:translate(3px,2px) rotate(0deg);
    }
 
    40% {
        transform:translate(1px,-1px) rotate(1deg);
    }
 
    50% {
        transform:translate(-1px,2px) rotate(-1deg);
    }
 
    60% {
        transform:translate(-3px,1px) rotate(0deg);
    }
 
    70% {
        transform:translate(3px,1px) rotate(-1deg);
    }
 
    80% {
        transform:translate(-1px,-1px) rotate(1deg);
    }
 
    90% {
        transform:translate(1px,2px) rotate(0deg);
    }
 
    100% {
        transform:translate(1px,1px) rotate(0deg);
    }
 
}

@keyframes changeColor{
    0%{color:white;}
    10%{color: red;}
    20%{color: white;}
    30%{color: red;}
    40%{color:white;}
    50%{color: red}
    60%{color: white;}
    70%{color: red;}
    80%{color: white;}
    90%{color: red;}
    100%{color: white;}
}