@font-face {
    font-family: 'arial';
  
    font-weight: normal;
    font-style: normal;
}
.ca-menu{
    padding:0;
    
	margin:160px 0px 5px 20px;
    width: 140px;
	position:absolute;
}
.ca-menu li{
    width: 140px;
    height: 25px;
    overflow: hidden;
    position: relative;
    display: block;
    background: #fff;
   
    margin-bottom: 2px;
    -webkit-transition: all 100ms ease-in-out;
	-moz-transition: all 100ms ease-in-out;
	-o-transition: all 100ms ease-in-out;
	-ms-transition: all 100ms ease-in-out;
	transition: all 100ms ease-in-out;
}
.ca-menu li:last-child{
    margin-bottom: 0px;
}
.ca-menu li a{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    color: #333;
    position: relative;
}

.ca-content{
    position: absolute;
    left: 4px;
    width: 140px;
    height: 25px;
    top: -8px;
}
.ca-main{
    font-size: 13px;
	 color: #999;
	   font-family: 'arial';
	   padding-left:10px;
	 
    -webkit-transition: all 300ms linear;
	-moz-transition: all 300ms linear;
	-o-transition: all 300ms linear;
	-ms-transition: all 300ms linear;
	transition: all 300ms linear; 
}
.ca-sub{
    font-size: 12px;
    color: #666;
}
.ca-menu li:hover{
    background-color: #000;
}
.ca-menu li:hover .ca-icon{
    color: #f900b0;
    font-size: 120px;
    opacity: 0.2;
    left: -20px;
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -ms-transform: rotate(20deg);
    transform: rotate(20deg);
}
.ca-menu li:hover .ca-main{
    color: #f900b0;
    opacity: 0.8;
}
.ca-menu li:hover .ca-sub{
    color: #fff;
    opacity: 0.8;
}