body
{
    color: #ffffff;
    background-color: #2d9fff;    
}

div
{
    font-size: 80px;
    font-family:aspergit;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
}

@font-face
{
    font-family: aspergit;
    src:url(Aspergit.otf);
}

.name
{
    margin-top: 150px;
    height: 100px;
    overflow: hidden;
    text-align: center;
}

.name:hover .nick
{
    transform: translate(0px,-80px);
}

.name:hover .realName
{
    transform: translate(0px,-80px);
}

.nick
{
    transition: all 0.5s;
    position: relative;
}

.realName
{
    transition: all 0.5s;
    position: relative;
}

img
{
    transition: all 0.5s;
    height: 32px;
}

img:hover
{
    transform: scale(1.2);   
}

.line
{
    border-top: 2px solid #ffffff;
}

.icons
{
    margin-top:20px;
}

.top {
  float:left;
  position: fixed;
  top: 0;
  left: 50px;
}

.top-elem {
  font-size: 22px;
  font-family: arial;
  color: #2d9fff;
  background-color: #ffffff;
  min-width: 120px;
  height: 35px;
  border-radius: 0px 0px 10px 10px;
  text-align:center;
  padding: 10px 10px 5px 10px;
  transition: all 0.5s;
}

.top-elem:hover {
  padding-top: 25px;
  height: 50px;
  transition: all 0.5s;
}

a {
  font-family: aspergit;
  color: #ffffff;
  text-decoration: none;
}