Diamond Player- CSS

#daemon {
    width:30px;
    height:30px;
    border:5px solid #000; /* BACKGROUND COLOR*/
    background-color:#000; /* BACKGROUND COLOR*/
    overflow:hidden;
    outline:5px solid #ccc; /*BORDER COLOR*/
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

#kero {
    position:fixed;
    bottom:30px;
    left:30px;
    width:40px;
    height:40px;
    transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

#flans {
    transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    padding:10px;
    margin-left:10px;
    margin-top:-02px;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

#kero:hover #daemon{
    transition-delay:.7s;
    width:150px;
    outline:5px solid #fff; /*BORDER COLOR ON HOVER*/
}

#kero:hover, #kero:hover #flans {
    transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -webkit-transform:rotate(360deg);
}

#kero:hover #flans {
    padding:0px;
    margin-left:0px;
    margin-top:-15px;
}

#daemon:hover #arcobaleno{
    padding-top:10px;
}

#kero:hover #arcobaleno {
    transition-delay:.7s;
    opacity:1;
}

#arcobaleno {
    padding-top:20px;
    width:150px;
    opacity:0;
        -webkit-transition: all 0.7s ease;
        -moz-transition: all 0.7s ease;
        transition: all 0.7s ease;
}