/* COLOR GENERATOR https://isotropic.co/tool/hex-color-to-css-filter/ */
/* SVG REPO https://www.svgrepo.com/svg/334396/arrow-from-right */
.exp-icon {
    background-size: cover;
    text-align: center;
    width: 1.25em;
    filter: invert(0%) sepia(99%) saturate(14%) hue-rotate(211deg) brightness(100%) contrast(101%);
}
.exp-icon.xs {
    width: 12px;
    height: 12px;
    font-size: .75em;
    line-height: .08333em;
    vertical-align: .125em;
}
.exp-icon.sm {
    width: 14px;
    height: 14px;
    font-size: .875em;
    line-height: .07143em;
    vertical-align: .05357em;
}
.exp-icon,
.exp-icon.md {
    width: 20px;
    height: 16px;
    font-size: 1rem;
    line-height: 1.6;
    vertical-align: baseline;
}
.exp-icon.lg {   
    width: 26px;
    height: 22px; 
    font-size: 1.25em;
    line-height: .05em;
    vertical-align: -.075em;
}
/* COLORS */
.exp-icon.text-success {
    filter: invert(52%) sepia(86%) saturate(536%) hue-rotate(77deg) brightness(92%) contrast(87%);
}
.exp-icon.text-muted {
    filter: invert(67%) sepia(7%) saturate(21%) hue-rotate(345deg) brightness(91%) contrast(117%);
}
.exp-icon.text-info {
    filter: invert(31%) sepia(14%) saturate(2731%) hue-rotate(149deg) brightness(97%) contrast(82%);
}
/* ICONS */
.exp-icon-arrow-from-left {
    background-image: url('../icons/arrow-from-left.svg');
}
.exp-icon-arrow-to-left {
    background-image: url('../icons/arrow-to-left.svg');
}
.exp-icon-arrow-from-right {
    background-image: url('../icons/arrow-from-right.svg');
}
.exp-icon-arrow-to-right {
    background-image: url('../icons/arrow-to-right.svg');
}
.exp-icon-more-horiz {
    background-image: url('../icons/more-horizontal.svg');
}
.exp-icon-double-arrows-down {
    background-image: url('../icons/double-arrows-down.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
.exp-icon-double-arrows-up {
    background-image: url('../icons/double-arrows-up.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
.exp-icon-arrows-split {
    background-image: url('../icons/arrows-split.svg');
    background-size: contain;
    background-repeat: no-repeat;
}
.exp-icon-arrows-converge {
    background-image: url('../icons/arrows-converge.svg');
    background-size: contain;
    background-repeat: no-repeat;
}