.icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: cover;
}

.menu-fold-icon {
    width: 24px;
    height: 24px;
    background-image: url("../images/menu-fold-icon.svg");
}

.menu-fold-icon:hover {
    background-image: url("../images/menu-fold-active-icon.svg");
}

.menu-unfold-icon {
    width: 24px;
    height: 24px;
    background-image: url("../images/menu-unfold-icon.svg");
}

.menu-unfold-icon:hover {
    background-image: url("../images/menu-unfold-active-icon.svg");
}

.arrow-down-icon {
    background-image: url("../images/arrow-down-icon.svg");
}

.arrow-up-icon {
    background-image: url("../images/arrow-up-icon.svg");
}

.arrow-left-icon {
    background-image: url("../images/arrow-left-icon.svg");
}

.arrow-right-icon {
    background-image: url("../images/arrow-right-icon.svg");
}

.arrow-left-line-icon {
    background-image: url("../images/arrow-left-line-icon.svg");
}

.arrow-right-line-icon {
    background-image: url("../images/arrow-right-line-icon.svg");
}

.arrow-down-s-icon {
    background-image: url("../images/arrow-down-s-icon.svg");
}

.add-icon {
    background-image: url("../images/add-icon.svg");
}

.close-icon {
    background-image: url("../images/close-icon.svg");
}

.close-white-icon {
    background-image: url("../images/close-white-icon.svg");
}

.circle-check-white-icon {
    background-image: url("../images/circle-check-white-icon.svg");
}

.circle-close-white-icon {
    background-image: url("../images/circle-close-white-icon.svg");
}

.circle-info-white-icon {
    background-image: url("../images/circle-info-white-icon.svg");
}

.calendar-icon {
    background-image: url("../images/calendar-icon.svg");
}

.time-icon {
    background-image: url("../images/time-icon.svg");
}

.align-justify-icon {
    background-image: url("../images/align-justify-icon.svg");
}

.reply-icon {
    background-image: url("../images/reply-icon.svg");
}

.reply-white-icon {
    background-image: url("../images/reply-white-icon.svg");
}

.reply-all-icon {
    background-image: url("../images/reply-all-icon.svg");
}

.reply-all-white-icon {
    background-image: url("../images/reply-all-white-icon.svg");
}

.forward-icon {
    background-image: url("../images/forward-icon.svg");
}

.forward-white-icon {
    background-image: url("../images/forward-white-icon.svg");
}

.trash-icon {
    background-image: url("../images/trash-icon.svg");
}

.trash-white-icon {
    background-image: url("../images/trash-white-icon.svg");
}

.pencil-icon {
    background-image: url("../images/pencil-icon.svg");
}

.pencil-underline-icon {
    background-image: url("../images/pencil-underline-icon.svg");
}

.eye-icon {
    background-image: url("../images/eye-icon.svg");
}

.folder-icon {
    background-image: url("../images/folder-icon.svg");
}

.plus-primary-icon {
    background-image: url("../images/plus-primary-icon.svg");
}

.plus-black-icon {
    background-image: url("../images/plus-black-icon.svg");
}

.plus-white-icon {
    background-image: url("../images/plus-white-icon.svg");
}

.download-icon {
    background-image: url("../images/download-icon.svg");
}

.search-icon {
    background-image: url("../images/search-icon.svg");
}

.ellipsis-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/ellipsis-icon.svg");
}

.attachment-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/attachment-icon.svg");
}

.link-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/link-icon.svg");
}

.external-link-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/external-link-icon.svg");
}

.tags-icon {
    background-image: url("../images/tags-icon.svg");
}

.loader-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/loader-icon.svg");
    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear; 
}

.loader-active-icon {
    width: 24px !important;
    height: 24px !important;
    background-image: url("../images/loader-active-icon.svg");
    animation-name: spin;
    animation-duration: 1000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear; 
}

.alert-danger-icon {
    background-image: url("../images/alert-danger-icon.svg");
}

.upload-icon {
    background-image: url("../images/upload-icon.svg");
}

.export-icon {
    background-image: url("../images/export-icon.svg");
}