
.iconsvg {
    position: relative;
    display: block;
    width: 30px;
    height: 30px;

} 
.iconsvg:before {
	position: absolute; top: 0; left: 0; content: "";
	width:100%; height:100%;
    background-color: #333;

    -webkit-mask-position: center;
    mask-position: center;
    
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
	
	/*-webkit-mask-size: 65% 65%;
    mask-size: 65% 65%;*/
}




/* ------------------------------------
	#new add
------------------------------------- */
.icon-cloud:before {
    -webkit-mask-image: url(../images/icon/icon-cloud.svg);
    mask-image: url(../images/icon/icon-cloud.svg);
}

.icon-art:before {
    -webkit-mask-image: url(../images/icon/icon-art.svg);
    mask-image: url(../images/icon/icon-art.svg);
}

.icon-landscape:before {
    -webkit-mask-image: url(../images/icon/icon-landscape.svg);
    mask-image: url(../images/icon/icon-landscape.svg);
}

.icon-msg:before {
    -webkit-mask-image: url(../images/icon/icon-msg.svg);
    mask-image: url(../images/icon/icon-msg.svg);
}

.icon-star:before {
    -webkit-mask-image: url(../images/icon/icon-star.svg);
    mask-image: url(../images/icon/icon-star.svg);
}

.icon-god:before {
    -webkit-mask-image: url(../images/icon/icon-god.svg);
    mask-image: url(../images/icon/icon-god.svg);
}

.icon-light:before {
    -webkit-mask-image: url(../images/icon/icon-light.svg);
    mask-image: url(../images/icon/icon-light.svg);
}


/* ------------------------------------
	#icon base
------------------------------------- */
.icon-facebook:before {
    -webkit-mask-image: url(../images/icon/icon-facebook.svg);
    mask-image: url(../images/icon/icon-facebook.svg);
}

.icon-line:before {
    -webkit-mask-image: url(../images/icon/icon-line.svg);
    mask-image: url(../images/icon/icon-line.svg);
}

.icon-instagram:before {
    -webkit-mask-image: url(../images/icon/icon-instagram.svg);
    mask-image: url(../images/icon/icon-instagram.svg);
}

.icon-wechat:before {
    -webkit-mask-image: url(../images/icon/icon-wechat.svg);
    mask-image: url(../images/icon/icon-wechat.svg);
}

.icon-twittert:before {
    -webkit-mask-image: url(../images/icon/icon-twitter.svg);
    mask-image: url(../images/icon/icon-twitter.svg);
}

.icon-skype:before {
    -webkit-mask-image: url(../images/icon/icon-skype.svg);
    mask-image: url(../images/icon/icon-skype.svg);
}

.icon-sina:before {
    -webkit-mask-image: url(../images/icon/icon-sina.svg);
    mask-image: url(../images/icon/icon-sina.svg);
}

.icon-global:before {
    -webkit-mask-image: url(../images/icon/icon-global.svg);
    mask-image: url(../images/icon/icon-global.svg);
}

.icon-phone:before {
    -webkit-mask-image: url(../images/icon/icon-phone.svg);
    mask-image: url(../images/icon/icon-phone.svg);
}

.icon-fax:before {
    -webkit-mask-image: url(../images/icon/icon-fax.svg);
    mask-image: url(../images/icon/icon-fax.svg);
}

.icon-mail:before {
    -webkit-mask-image: url(../images/icon/icon-mail.svg);
    mask-image: url(../images/icon/icon-mail.svg);
}

.icon-open:before {
    -webkit-mask-image: url(../images/icon/icon-open.svg);
    mask-image: url(../images/icon/icon-open.svg);
}

.icon-number:before {
    -webkit-mask-image: url(../images/icon/icon-number.svg);
    mask-image: url(../images/icon/icon-number.svg);
}

.icon-address:before {
    -webkit-mask-image: url(../images/icon/icon-address.svg);
    mask-image: url(../images/icon/icon-address.svg);
}

.icon-youtube:before {
    -webkit-mask-image: url(../images/icon/icon-youtube.svg);
    mask-image: url(../images/icon/icon-youtube.svg);
}

/*.icon-youtube2:before {
    -webkit-mask-image: url(../images/icon/icon-youtube2.svg);
    mask-image: url(../images/icon/icon-youtube2.svg);
}

.icon-video:before {
    -webkit-mask-image: url(../images/icon/icon-video.svg);
    mask-image: url(../images/icon/icon-video.svg);
}

.icon-triangle-right:before {
    -webkit-mask-image: url(../images/icon/icon-triangle-right.svg);
    mask-image: url(../images/icon/icon-triangle-right.svg);
}*/

.icon-announce:before {
    -webkit-mask-image: url(../images/icon/icon-announce.svg);
    mask-image: url(../images/icon/icon-announce.svg);
}

.icon-albums:before {
    -webkit-mask-image: url(../images/icon/icon-albums.svg);
    mask-image: url(../images/icon/icon-albums.svg);
}

/*.icon-go:before {
    -webkit-mask-image: url(../images/icon/icon-go.svg);
    mask-image: url(../images/icon/icon-go.svg);
}*/

.icon-double-right:before {
    -webkit-mask-image: url(../images/icon/icon-double-right.svg);
    mask-image: url(../images/icon/icon-double-right.svg);
}

/*.icon-double-left:before {
    -webkit-mask-image: url(../images/icon/icon-double-left.svg);
    mask-image: url(../images/icon/icon-double-left.svg);
}

.icon-double-right2:before {
    -webkit-mask-image: url(../images/icon/icon-double-right2.svg);
    mask-image: url(../images/icon/icon-double-right2.svg);
}

.icon-double-left2:before {
    -webkit-mask-image: url(../images/icon/icon-double-left2.svg);
    mask-image: url(../images/icon/icon-double-left2.svg);
}

.icon-top:before {
    -webkit-mask-image: url(../images/icon/icon-top.svg);
    mask-image: url(../images/icon/icon-top.svg);
}*/

.icon-scrolltop:before {
    -webkit-mask-image: url(../images/icon/icon-scrolltop.svg);
    mask-image: url(../images/icon/icon-scrolltop.svg);
}

/*.icon-circle-add:before {
    -webkit-mask-image: url(../images/icon/icon-circle-add.svg);
    mask-image: url(../images/icon/icon-circle-add.svg);
}*/

.icon-home:before {
    -webkit-mask-image: url(../images/icon/icon-home.svg);
    mask-image: url(../images/icon/icon-home.svg);
}

.icon-person:before {
    -webkit-mask-image: url(../images/icon/icon-person.svg);
    mask-image: url(../images/icon/icon-person.svg);
}

.icon-company:before {
    -webkit-mask-image: url(../images/icon/icon-company.svg);
    mask-image: url(../images/icon/icon-company.svg);
}

.icon-tag:before {
    -webkit-mask-image: url(../images/icon/icon-tag.svg);
    mask-image: url(../images/icon/icon-tag.svg);
}

.icon-calendar:before {
    -webkit-mask-image: url(../images/icon/icon-calendar.svg);
    mask-image: url(../images/icon/icon-calendar.svg);
}

.icon-clock:before {
    -webkit-mask-image: url(../images/icon/icon-clock.svg);
    mask-image: url(../images/icon/icon-clock.svg);
}

/*.icon-check:before {
    -webkit-mask-image: url(../images/icon/icon-check.svg);
    mask-image: url(../images/icon/icon-check.svg);
}*/

.icon-search:before {
    -webkit-mask-image: url(../images/icon/icon-search.svg);
    mask-image: url(../images/icon/icon-search.svg);
}

.icon-link:before {
    -webkit-mask-image: url(../images/icon/icon-link.svg);
    mask-image: url(../images/icon/icon-link.svg);
}

.icon-download:before {
    -webkit-mask-image: url(../images/icon/icon-download.svg);
    mask-image: url(../images/icon/icon-download.svg);
}

.icon-info:before {
    -webkit-mask-image: url(../images/icon/icon-info.svg);
    mask-image: url(../images/icon/icon-info.svg);
}

.icon-pageback:before {
    -webkit-mask-image: url(../images/icon/icon-pageback.svg);
    mask-image: url(../images/icon/icon-pageback.svg);
}

/*.icon-star:before {
    -webkit-mask-image: url(../images/icon/icon-star.svg);
    mask-image: url(../images/icon/icon-star.svg);
}

.icon-star-empty:before {
    -webkit-mask-image: url(../images/icon/icon-star-empty.svg);
    mask-image: url(../images/icon/icon-star-empty.svg);
}

.icon-heart:before {
    -webkit-mask-image: url(../images/icon/icon-heart.svg);
    mask-image: url(../images/icon/icon-heart.svg);
}

.icon-heart-empty:before {
    -webkit-mask-image: url(../images/icon/icon-heart-empty.svg);
    mask-image: url(../images/icon/icon-heart-empty.svg);
}*/



