.svg-icon-background {
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
}

.svg-icon {
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
    position: relative;
    display: inline-block;
    line-height: 1em;
}

    .svg-icon.svg-plus::after {
        content: "";
        position: absolute;
        width: 50%;
        height: 50%;
        bottom: 0;
        right: 0;
        background-image: url(/images/Plus.svg);
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

.svg-fill {
    height: 100%;
    width: 100%;
}

.svg-xxs {
    width: 16px;
    height: 16px;
}

.svg-xs {
    width: 32px;
    height: 32px;
}

.svg-s {
    width: 48px;
    height: 48px;
}

.svg-m {
    width: 64px;
    height: 64px;
}

.svg-xl {
    width: 192px;
    height: 192px;
}

.svg-icon-ship {
    background-image: url(/images/Ship.svg);
}

.svg-icon-truck {
    background-image: url(/images/Truck.svg);
}

.svg-icon-plane {
    background-image: url(/images/Aeroplane.svg);
}

.svg-icon-warehouse {
    background-image: url(/images/Warehouse.svg);
}

.svg-icon-ship-KC {
    background-image: url(/images/Ship-KC.svg);
}

.svg-icon-truck-KC {
    background-image: url(/images/Truck-KC.svg);
}

.svg-icon-plane-KC {
    background-image: url(/images/Aeroplane-KC.svg);
}

.svg-icon-warehouse-KC {
    background-image: url(/images/Warehouse-KC.svg);
}