CssPerfil

<style>
 .video{
      position:absolute;
  top:-50%;
  left:0%;
  width:100%;
  height:200%;
  z-index:6;
     pointer-events:all;
              overflow-x:hidden;
overflow-y:hidden;
transition: all 2s ease-in-out;
}

.acontvideo:hover, .avideo.hover_effect {
      transform: translate(0px ,0px) scale(2,2);
      top:0%;
      height:100%;
      opacity:0.8;

   }


    .contvideo{
     background-color:#000;
    position: absolute;
    height: 50%;
    width: 50%;
    z-index: 4;
    opacity: 1.5;
border-radius:10px;
    top: 20%;
        transition: all 2s ease-in-out;
        left: 25%;
        border:0px solid #c0bccd;
    }
    .fondo1{
      position: absolute;
      height: 102%;
      width: 102%;
      z-index: 2;
      top: -1%;
      left: -1%;
        background: #000 url(http://orig00.deviantart.net/a9d7/f/2016/039/9/e/gifdefondo_by_hekirei-d9r1tar.gif);
        background-size: 20% 20%;
        margin: 0%;
         }
        .barranegra{
            background-color: black;
            position: absolute;
            z-index: 1;
            width: 100%;
            height: 100%;
            left: 0%;
            top: 0%;
        }
    .chicaanime{
        position: absolute;
        z-index: 1;
        height: 75%;
        width: 20%;
        top: 20%;
        left: 0%;
    }
.gif1{
  position: absolute;
    z-index: 2;
    height: 33%;
    width: 25%;
    left: 15%;
    top: 70%;
   }

    .gifanime{

      position: absolute;
    z-index: 2;
    height: 30%;
    width: 20%;
    left: 40%;
    top: 70%;
    }
.visitlogger{
position:absolute;
height:4%;
width:7%;
   background-color:#858585;
z-index:2;
border-radius:1%;
                -webkit-transition:all 1s ease;
-o-transition:all 1s ease;
transition:all 1s ease;
      top: 70%;
left:1%;

  }
    .barry1{
        text-align: center;
    }
    .barry1:hover{
        opacity: 0.0;
    }
.visitlogger:hover{
width:100%;
height:100%;
position:absolute;
border-radius:0%;
    background: transparent;
            -webkit-transition:all 1s ease;
-o-transition:all 1s ease;
transition:all 1s ease;
left:1%;
  top: 0%;
 }
.barry{
  position:absolute;
height:100%;
width:100%;
    background-position: absolute;
    background-size: 100% 100%;
    opacity: 0.0;
            -webkit-transition:all 1s ease;
-o-transition:all 1s ease;
transition:all 1s ease;
left:0%;
 }
.barry:hover{
    background:url("http://www.dayztv.com/wp-content/uploads/avatars/4466/2a1e0fc0b926915dd330bcb689720452-bpthumb.png" )no-repeat;
    background-size: 25% 100%;
    opacity: 1.0;
 }
    .transparent{
        position: relative;
        z-index: 99;
        height: 100%;
        width: 100%;
        left: 25%;
    }
    .bgazul{
        position: absolute;
        z-index: 1;
        height: 100%;
        width: 60%;
        right: 0%;
    }
     .madara{
        position: absolute;
        z-index: 5;
        height: 90%;
        width: 30%;
        right: 0%;
         top:
    }
              #chatwithme {
        color: aqua;
        text-align: center;
position:absolute;
height:100%;
left:0%;
top:0%;
width:100%;
    }
    .charlar{
  left: 40%;
  top: 85%;
  position: absolute;
  z-index: 16;
    height: 7%;
  width: 15%;
        opacity: 0.5;
background-color: #6b6b6b;
    border-radius: 10px  30px 10px 10px;
        box-shadow: 5px 5px 5px #00fcff;
                      -webkit-transition:all 1s ease;
-o-transition:all 1s ease;
transition:all 1s ease;

}
    .charlar:hover{
        opacity: 1;
        box-shadow: 10px 10px 5px #00fcff;
    }
      </style>