.trnIcon
{
	height:20px;
	width:20px;
	background-repeat:no-repeat;
}

.trnSaleIcon
{
	-webkit-mask: url(../img/sale.svg) no-repeat 100% 100%;
	mask: url(../img/sale.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;
}

.trnBuyIcon
{
	-webkit-mask: url(../img/buy.svg) no-repeat 100% 100%;
	mask: url(../img/buy.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;	
}

.trnDebtIcon
{
	-webkit-mask: url(../img/debt.svg) no-repeat 100% 100%;
	mask: url(../img/debt.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;	
}

.trnCreditIcon
{
	-webkit-mask: url(../img/credit.svg) no-repeat 100% 100%;
	mask: url(../img/credit.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;	
}

.trnIncomingIcon
{
	-webkit-mask: url(../img/incoming.svg) no-repeat 100% 100%;
	mask: url(../img/incoming.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;	
}

.trnOutgoingIcon
{
	-webkit-mask: url(../img/outgoing.svg) no-repeat 100% 100%;
	mask: url(../img/outgoing.svg) no-repeat 100% 100%;
	-webkit-mask-size: center;
	mask-size: center;
	background-size: center;
	background-color: #FFF;	
}