﻿:root {
    --icon-red: #D11C1C;
    --icon-green: #039C23;
    --icon-blue: #1177D7;
    --icon-yellow: #FFB115;
    --icon-black: #727272;
    --icon-white: #ffffff;
}

.icon-red {
    color: var(--icon-red);
}

.icon-green {
    color: var(--icon-green);
}

.icon-blue {
    color: var(--icon-blue);
}

.icon-yellow {
    color: var(--icon-yellow);
}

.icon-black {
    color: var(--icon-black);
}

.icon-white {
    color: var(--icon-white);
}

.icon-primary-red {
    --fa-primary-color: var(--icon-red);
}

.icon-primary-green {
    --fa-primary-color: var(--icon-green);
}

.icon-primary-blue {
    --fa-primary-color: var(--icon-blue);
}

.icon-primary-yellow {
    --fa-primary-color: var(--icon-yellow);
}

.icon-primary-black {
    --fa-primary-color: var(--icon-black);
}

.icon-primary-white {
    --fa-primary-color: var(--icon-white);
}

.icon-secondary-red {
    --fa-secondary-color: var(--icon-red);
}

.icon-secondary-green {
    --fa-secondary-color: var(--icon-green);
}

.icon-secondary-blue {
    --fa-secondary-color: var(--icon-blue);
}

.icon-secondary-yellow {
    --fa-secondary-color: var(--icon-yellow);
}

.icon-secondary-black {
    --fa-secondary-color: var(--icon-black);
}

.icon-secondary-white {
    --fa-secondary-color: var(--icon-white);
}

.homepage-card .fa-calendar-week {
    color: var(--icon-blue);
}

.homepage-card .fa-receipt {
    color: var(--icon-blue);
}

.homepage-card .fa-calendar-check {
    color: var(--icon-green);
}

.main-menu {
}

    .main-menu .fa-xl {
        height: 1.35rem;
    }

.ico {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
}

.ico-copy {
    height: 16px;
    width: 14px;
    margin-left: 1px;
    margin-right: 1px;
    -webkit-mask-image: url(../images/icons/copy.svg);
}

.ico-plus {
    height: 16px;
    width: 12px;
    margin-left: 2px;
    margin-right: 2px;
    -webkit-mask-image: url(../images/icons/plus.svg);
}

.ico-delegate {
    height: 16px;
    width: 20px;
    -webkit-mask-image: url(../images/icons/user-group.svg);
}

.ico-travel {
    height: 16px;
    width: 15px;
    margin-left: 1px;
    -webkit-mask-image: url(../images/icons/car-alt.svg);
}

.ico-expense {
    height: 16px;
    width: 12px;
    margin-left: 2px;
    margin-left: 2px;
    -webkit-mask-image: url(../images/icons/receipt.svg);
}

.ico-activity {
    height: 14px;
    width: 16px;
    margin-top: 1px;
    margin-bottom: 1px;
    -webkit-mask-image: url(../images/icons/hammer.svg);
}

.ico-allowance {
    height: 16px;
    width: 15px;
    margin-left: 1px;
    -webkit-mask-image: url(../images/icons/coins-duotone.svg);
}

.ico-travel-large {
    height: 24px;
    width: 22px;
    margin-left: 2px;
    -webkit-mask-image: url(../images/icons/car-alt-duotone.svg);
}

.ico-travelreturn-large {
    height: 20px;
    width: 24px;
    margin-top: 2px;
    margin-bottom: 2px;
    -webkit-mask-image: url(../images/icons/cars-duotone.svg);
}

.ico-activity-large {
    height: 20px;
    width: 24px;
    margin-top: 2px;
    margin-bottom: 2px;
    -webkit-mask-image: url(../images/icons/hammer-duotone.svg);
}

.ico-allowance-large {
    height: 24px;
    width: 24px;
    -webkit-mask-image: url(../images/icons/coins-duotone.svg);
}

.ico-expense-large {
    height: 24px;
    width: 18px;
    margin-left: 3px;
    margin-right: 3px;
    -webkit-mask-image: url(../images/icons/receipt-duotone.svg);
}
