.play-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-play-fill' viewBox='0 0 16 16'%3E%3Cpath d='m11.596 8.697-6.363 3.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01 1.233-.696l6.363 3.692a.802.802 0 0 1 0 1.393z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.pause-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-pause-fill' viewBox='0 0 16 16'%3E%3Cpath d='M5.5 3.5A1.5 1.5 0 0 1 7 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5zm5 0A1.5 1.5 0 0 1 12 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.stop-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-stop-fill' viewBox='0 0 16 16'%3E%3Cpath d='M5 3.5h6A1.5 1.5 0 0 1 12.5 5v6a1.5 1.5 0 0 1-1.5 1.5H5A1.5 1.5 0 0 1 3.5 11V5A1.5 1.5 0 0 1 5 3.5z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.record-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='red' class='bi bi-record-fill' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 13A5 5 0 1 0 8 3a5 5 0 0 0 0 10z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.automation-icon {
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 24.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='lightgrey' width='16' height='16'%3E%3Cg%3E%3Cpath d='M443.7,12.8L443.7,12.8c-37.7,0-68.2,30.5-68.2,68.2c0,24.1,12.5,45.3,31.3,57.4l0.3,0.2l-44.5,155.9l-4.2-0.1h-0.1 c-15.3,0-29.5,5.1-40.8,13.6l0.2-0.1l-82.3-68.5c2.3-6.5,3.6-14,3.6-21.8c0-37.7-30.5-68.2-68.2-68.2c-37.7,0-68.2,30.5-68.2,68.2 c0,19.1,7.9,36.4,20.5,48.8l0,0l-48.3,96.6c-2.1-0.2-4.2-0.3-6.4-0.3h-0.1C30.6,362.6,0,393.1,0,430.9s30.6,68.3,68.3,68.3 s68.3-30.6,68.3-68.3c0-23.2-11.6-43.8-29.4-56.1l-0.2-0.1l45.6-91.2c5.4,1.5,11.7,2.5,18.1,2.5c17.7,0,33.8-6.8,45.9-17.8l0,0 l79.7,66.4c-3.8,8.3-6.1,18-6.1,28.2c0,37.7,30.6,68.2,68.2,68.2c37.7,0,68.2-30.5,68.2-68.2c0-24.1-12.5-45.3-31.3-57.4l-0.3-0.2 l44.5-155.9l4.2,0.1c37.7,0,68.2-30.6,68.2-68.2C512,43.4,481.5,12.9,443.7,12.8L443.7,12.8z M68.4,464.9 c-18.8,0-34.1-15.3-34.1-34.1s15.3-34.1,34.1-34.1s34.1,15.3,34.1,34.1C102.5,449.6,87.3,464.8,68.4,464.9z M170.8,251.6 c-18.8,0-34.1-15.3-34.1-34.1s15.3-34.1,34.1-34.1s34.1,15.3,34.1,34.1C204.9,236.3,189.6,251.6,170.8,251.6z M358.4,396.6 c-18.8,0-34.1-15.3-34.1-34.1s15.3-34.1,34.1-34.1s34.1,15.3,34.1,34.1C392.5,381.3,377.3,396.6,358.4,396.6z M443.7,115.2 c-18.8,0-34.1-15.3-34.1-34.1s15.3-34.1,34.1-34.1c18.8,0,34.1,15.3,34.1,34.1C477.8,99.9,462.6,115.1,443.7,115.2z'/%3E%3C/g%3E%3C/svg%3E%0A");
    width: 34px;
    height: auto;
}

.skip-start-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-skip-start-fill' viewBox='0 0 16 16'%3E%3Cpath d='M4 4a.5.5 0 0 1 1 0v3.248l6.267-3.636c.54-.313 1.232.066 1.232.696v7.384c0 .63-.692 1.01-1.232.697L5 8.753V12a.5.5 0 0 1-1 0V4z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.add-fill-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.volume-up-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-volume-up-fill' viewBox='0 0 16 16'%3E%3Cpath d='M11.536 14.01A8.473 8.473 0 0 0 14.026 8a8.473 8.473 0 0 0-2.49-6.01l-.708.707A7.476 7.476 0 0 1 13.025 8c0 2.071-.84 3.946-2.197 5.303l.708.707z'/%3E%3Cpath d='M10.121 12.596A6.48 6.48 0 0 0 12.025 8a6.48 6.48 0 0 0-1.904-4.596l-.707.707A5.483 5.483 0 0 1 11.025 8a5.483 5.483 0 0 1-1.61 3.89l.706.706z'/%3E%3Cpath d='M8.707 11.182A4.486 4.486 0 0 0 10.025 8a4.486 4.486 0 0 0-1.318-3.182L8 5.525A3.489 3.489 0 0 1 9.025 8 3.49 3.49 0 0 1 8 10.475l.707.707zM6.717 3.55A.5.5 0 0 1 7 4v8a.5.5 0 0 1-.812.39L3.825 10.5H1.5A.5.5 0 0 1 1 10V6a.5.5 0 0 1 .5-.5h2.325l2.363-1.89a.5.5 0 0 1 .529-.06z'/%3E%3C/svg%3E");
    width: 24px;
    height: auto;
}

.volume-down-icon {
    content: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-volume-down-fill' viewBox='0 0 16 16'%3E%3Cpath d='M9 4a.5.5 0 0 0-.812-.39L5.825 5.5H3.5A.5.5 0 0 0 3 6v4a.5.5 0 0 0 .5.5h2.325l2.363 1.89A.5.5 0 0 0 9 12V4zm3.025 4a4.486 4.486 0 0 1-1.318 3.182L10 10.475A3.489 3.489 0 0 0 11.025 8 3.49 3.49 0 0 0 10 5.525l.707-.707A4.486 4.486 0 0 1 12.025 8z'/%3E%3C/svg%3E");
    width: 24px;
    height: auto;
}

.volume-off-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-volume-mute-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.717 3.55A.5.5 0 0 1 7 4v8a.5.5 0 0 1-.812.39L3.825 10.5H1.5A.5.5 0 0 1 1 10V6a.5.5 0 0 1 .5-.5h2.325l2.363-1.89a.5.5 0 0 1 .529-.06zm7.137 2.096a.5.5 0 0 1 0 .708L12.207 8l1.647 1.646a.5.5 0 0 1-.708.708L11.5 8.707l-1.646 1.647a.5.5 0 0 1-.708-.708L10.793 8 9.146 6.354a.5.5 0 1 1 .708-.708L11.5 7.293l1.646-1.647a.5.5 0 0 1 .708 0z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.snap-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='lightgrey' class='bi bi-grid-3x3' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A1.5 1.5 0 0 1 1.5 0h13A1.5 1.5 0 0 1 16 1.5v13a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 14.5v-13zM1.5 1a.5.5 0 0 0-.5.5V5h4V1H1.5zM5 6H1v4h4V6zm1 4h4V6H6v4zm-1 1H1v3.5a.5.5 0 0 0 .5.5H5v-4zm1 0v4h4v-4H6zm5 0v4h3.5a.5.5 0 0 0 .5-.5V11h-4zm0-1h4V6h-4v4zm0-5h4V1.5a.5.5 0 0 0-.5-.5H11v4zm-1 0V1H6v4h4z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.snap-icon-off {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='rgb(100, 100, 100)' class='bi bi-grid-3x3' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5A1.5 1.5 0 0 1 1.5 0h13A1.5 1.5 0 0 1 16 1.5v13a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 14.5v-13zM1.5 1a.5.5 0 0 0-.5.5V5h4V1H1.5zM5 6H1v4h4V6zm1 4h4V6H6v4zm-1 1H1v3.5a.5.5 0 0 0 .5.5H5v-4zm1 0v4h4v-4H6zm5 0v4h3.5a.5.5 0 0 0 .5-.5V11h-4zm0-1h4V6h-4v4zm0-5h4V1.5a.5.5 0 0 0-.5-.5H11v4zm-1 0V1H6v4h4z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.split-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='lightgrey' class='bi bi-scissors' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61 3.5 3.5zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0zm7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.split-icon-off {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='rgb(100, 100, 100)' class='bi bi-scissors' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 3.5c-.614-.884-.074-1.962.858-2.5L8 7.226 11.642 1c.932.538 1.472 1.616.858 2.5L8.81 8.61l1.556 2.661a2.5 2.5 0 1 1-.794.637L8 9.73l-1.572 2.177a2.5 2.5 0 1 1-.794-.637L7.19 8.61 3.5 3.5zm2.5 10a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0zm7 0a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.merge-icon {
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg width='16' height='16' fill='currentColor' stroke='lightgrey' class='bi bi-scissors' viewBox='0 0 16 16' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cdefs id='defs1' /%3E%3Cpath d='M 11.210461,1.3671524 C 11.864222,0.87965119 12.634199,0.54146606 12.991082,1 l 1.178563,1.5142524 1.203071,1.5457396 c 0.242519,0.3115948 -0.205171,1.0638644 -0.858932,1.5513656 m 0,0 -3.922571,2.9250073 -1.3075235,0.9750023 C 8.6299277,9.9988685 7.6458334,10.061949 6.3245041,8.3642671 5.003175,6.6665851 5.3266046,5.7546633 5.9803664,5.2671622 L 7.28789,4.2921597 11.210461,1.3671524 M 6.9629594,10.572903 c -0.6934196,0.517074 -1.9386556,0.103249 -1.9386556,0.103249 0,0 -2.8241439,1.681351 -3.2761323,1.100623 -0.4519884,-0.580728 1.9539622,-2.7993856 1.9539622,-2.7993856 0,0 -0.095655,-1.3676618 0.5488949,-1.8888539 0.1544211,1.1244959 1.7789017,3.1090285 2.7119308,3.4843675 z M 2,13 C 1.1600084,12.223991 0.31180854,13.904732 1.1518001,14.680741 1.9917912,15.45675 2.8399911,13.776009 2,13 Z' id='path1' style='stroke-width:0.812998' /%3E%3C/svg%3E%0A");
    width: 34px;
    height: auto;
}

.undo-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='lightgrey' class='bi bi-arrow-counterclockwise' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.undo-icon-off {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='rgb(100, 100, 100)' class='bi bi-arrow-counterclockwise' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.redo-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='lightgrey' class='bi bi-arrow-clockwise' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}
.redo-icon-off {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' stroke='rgb(100, 100, 100)' class='bi bi-arrow-clockwise' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z'/%3E%3Cpath d='M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.monitor-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-volume-down-fill' viewBox='0 0 16 16'%3E%3Cpath d='M9 4a.5.5 0 0 0-.812-.39L5.825 5.5H3.5A.5.5 0 0 0 3 6v4a.5.5 0 0 0 .5.5h2.325l2.363 1.89A.5.5 0 0 0 9 12V4zm3.025 4a4.486 4.486 0 0 1-1.318 3.182L10 10.475A3.489 3.489 0 0 0 11.025 8 3.49 3.49 0 0 0 10 5.525l.707-.707A4.486 4.486 0 0 1 12.025 8z'/%3E%3C/svg%3E");
    width: 24px;
    height: auto;
}

.menu-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-list' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.loop-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-arrow-repeat' viewBox='0 0 16 16'%3E%3Cpath d='M11.534 7h3.932a.25.25 0 0 1 .192.41l-1.966 2.36a.25.25 0 0 1-.384 0l-1.966-2.36a.25.25 0 0 1 .192-.41zm-11 2h3.932a.25.25 0 0 0 .192-.41L2.692 6.23a.25.25 0 0 0-.384 0L.342 8.59A.25.25 0 0 0 .534 9z'/%3E%3Cpath fill-rule='evenodd' d='M8 3c-1.552 0-2.94.707-3.857 1.818a.5.5 0 1 1-.771-.636A6.002 6.002 0 0 1 13.917 7H12.9A5.002 5.002 0 0 0 8 3zM3.1 9a5.002 5.002 0 0 0 8.757 2.182.5.5 0 1 1 .771.636A6.002 6.002 0 0 1 2.083 9H3.1z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.plugin-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-plugin' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1 8a7 7 0 1 1 2.898 5.673c-.167-.121-.216-.406-.002-.62l1.8-1.8a3.5 3.5 0 0 0 4.572-.328l1.414-1.415a.5.5 0 0 0 0-.707l-.707-.707 1.559-1.563a.5.5 0 1 0-.708-.706l-1.559 1.562-1.414-1.414 1.56-1.562a.5.5 0 1 0-.707-.706l-1.56 1.56-.707-.706a.5.5 0 0 0-.707 0L5.318 5.975a3.5 3.5 0 0 0-.328 4.571l-1.8 1.8c-.58.58-.62 1.6.121 2.137A8 8 0 1 0 0 8a.5.5 0 0 0 1 0Z'/%3E%3C/svg%3E");
    width: 16px;
    height: auto;
}

.sliders-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-sliders' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M11.5 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM9.05 3a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0V3h9.05zM4.5 7a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zM2.05 8a2.5 2.5 0 0 1 4.9 0H16v1H6.95a2.5 2.5 0 0 1-4.9 0H0V8h2.05zm9.45 4a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3zm-2.45 1a2.5 2.5 0 0 1 4.9 0H16v1h-2.05a2.5 2.5 0 0 1-4.9 0H0v-1h9.05z'/%3E%3C/svg%3E");
    width: 16px;
    height: auto;
}

.music-file-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-file-music-fill' viewBox='0 0 16 16'%3E%3Cpath d='M12 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zm-.5 4.11v1.8l-2.5.5v5.09c0 .495-.301.883-.662 1.123C7.974 12.866 7.499 13 7 13c-.5 0-.974-.134-1.338-.377-.36-.24-.662-.628-.662-1.123s.301-.883.662-1.123C6.026 10.134 6.501 10 7 10c.356 0 .7.068 1 .196V4.41a1 1 0 0 1 .804-.98l1.5-.3a1 1 0 0 1 1.196.98z'/%3E%3C/svg%3E");
    width: 16px;
    height: auto;
}

.mic-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-mic-fill' viewBox='0 0 16 16'%3E%3Cpath d='M5 3a3 3 0 0 1 6 0v5a3 3 0 0 1-6 0V3z'/%3E%3Cpath d='M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.midi-icon{
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg class='bi bi-mic-fill' width='16' height='16' fill='lightgrey' version='1.1' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m2.9629-0.33203v8.1582c0.00183 0.010491 0.00333 0.019778 0.00391 0.023437 0.01144 0.073093 0.00982 0.10705 0.00977 0.10547 0.00335 0.091743 0.00543 0.27435 0.00781 0.63281 0.00329 0.00169 0.021828 0.01956 0.091797 0.054687 0.12755 0.064031 0.4237 0.13506 0.70117 0.13672 0.27718 0.00166 0.5642-0.066323 0.68555-0.12695 0.070005-0.034979 0.087283-0.051889 0.087891-0.050781v-8.9336zm4.0801 0v8.1523c0.00215 0.00906 0.00262 0.00855 0.00586 0.029297 0.011441 0.073093 0.00982 0.10705 0.00977 0.10547 0.00335 0.091743 0.00543 0.27435 0.00781 0.63281 0.00334 0.00173 0.021887 0.019562 0.091797 0.054687 0.12816 0.064392 0.42024 0.13506 0.69727 0.13672 0.27673 0.00166 0.56728-0.066838 0.6875-0.12695 0.069553-0.03478 0.085789-0.052379 0.085937-0.050781v-8.9336zm4.4082 0v8.1523c0.0016 0.00643 0.0013 0.00321 0.0039 0.017578a0.22099 0.22099 0 0 1 0 0.00195c0.01441 0.083223 0.01239 0.12958 0.01172 0.11328 0.0037 0.09166 0.0074 0.27554 0.0098 0.63477 0.0033 0.00174 0.02189 0.019562 0.0918 0.054687 0.12816 0.064394 0.42024 0.13506 0.69727 0.13672 0.27674 0.00166 0.56728-0.066839 0.6875-0.12695 0.06995-0.034977 0.08724-0.051845 0.08789-0.050781v-8.9336zm-5.8965 0.55273v8.4609c0 0.33121-0.22387 0.59065-0.50195 0.74414-0.2241 0.1237-0.49789 0.18908-0.7832 0.22852v6.125h3.0879v-6.1289c-0.28716-0.041567-0.56189-0.11099-0.78711-0.23438-0.26912-0.14743-0.48127-0.39147-0.49805-0.70312a0.22099 0.22099 0 0 1-0.03125-0.03125v-8.4609zm4.0781 0v8.4609c0 0.31726-0.20618 0.56973-0.4668 0.72266-0.20877 0.1225-0.46445 0.19194-0.73242 0.23633v6.1387h3.2793v-6.1582c-0.27088-0.045245-0.54194-0.096162-0.75391-0.2168-0.25685-0.14618-0.45636-0.38661-0.47461-0.6875a0.22099 0.22099 0 0 1-0.03516-0.035156v-8.4609zm4.4102 0.074219v8.3613c0 0.32654-0.21475 0.58719-0.48633 0.74805-0.21882 0.12961-0.48746 0.20272-0.76953 0.24609 5.06e-4 1.9937 0.0092 4.638 0.0098 6.1289 0.5771 0.0041 0.54986 0 1.0254 0 1.1453 0 1.957-0.91085 1.957-1.8047v-11.916c0-0.41579-0.22208-0.8375-0.58984-1.1777-0.30698-0.28397-0.71815-0.47922-1.1465-0.58594zm-12.084 0.023437c-0.42649 0.10527-0.83787 0.29843-1.1465 0.57422-0.36988 0.33054-0.5918 0.73575-0.5918 1.1074v11.896c-1e-8 0.46807 0.27219 0.93868 0.70508 1.2949s1.0182 0.58789 1.5879 0.58789h0.68359v-6.1641c-0.2658-0.046532-0.53294-0.096581-0.74023-0.2168-0.2534-0.14696-0.45065-0.38619-0.4668-0.68555a0.22099 0.22099 0 0 1-0.03125-0.03125z' stroke-width='1.5874'/%3E%3C/svg%3E%0A");
    width: 34px;
    height: auto;
}

.close-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='lightgrey' class='bi bi-x-circle-fill' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z'/%3E%3C/svg%3E");
    width: 34px;
    height: auto;
}

.metro-icon {
    content: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 fill=%22lightgrey%22 width=%2224px%22 height=%2224px%22 viewBox=%220 0 24 24%22%3E %3Cpolygon points=%2214,13 10,13 10,14 14,14 14,13%22/%3E %3Cpolygon points=%2214,10 10,10 10,11 14,11 14,10%22/%3E %3Cpolygon points=%2214,7 10,7 10,8 14,8 14,7%22/%3E %3Cpolygon points=%2223.8,8.9 23.1,8.2 21.5,9.7 20.9,9.1 19.5,10.5 20.1,11.2 11.3,20 6.3,20 8.7,4 15.3,4 16.7,13.9 18.4,12.1 17,2 7,2 4,22 20,22 18.8,14.6 17.1,16.3 17.7,20 12.7,20 20.8,11.9 21.5,12.5 22.9,11.1 22.3,10.5 %22/%3E %3C/svg%3E");
    width: 24px;
    height: 24px;
}

.metro-icon-flip {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='lightgrey' width='24px' height='24px' viewBox='0 0 24 24'%3E%3Cg transform='scale(-1, 1) translate(-24, 0)'%3E%3Cpolygon points='14,13 10,13 10,14 14,14 14,13'/%3E%3Cpolygon points='14,10 10,10 10,11 14,11 14,10'/%3E%3Cpolygon points='14,7 10,7 10,8 14,8 14,7'/%3E%3Cpolygon points='23.8,8.9 23.1,8.2 21.5,9.7 20.9,9.1 19.5,10.5 20.1,11.2 11.3,20 6.3,20 8.7,4 15.3,4 16.7,13.9 18.4,12.1 17,2 7,2 4,22 20,22 18.8,14.6 17.1,16.3 17.7,20 12.7,20 20.8,11.9 21.5,12.5 22.9,11.1 22.3,10.5'/%3E%3C/g%3E%3C/svg%3E%0A");
    width: 24px;
    height: 24px;
}

.menu-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-list' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
    width: 28px;
    height: auto;
}

.plus-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
    width: 40px;
    height: auto;
}

.arrow-down-left-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-arrow-down-left-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 16a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2zm8.096-10.803L6 9.293V6.525a.5.5 0 0 0-1 0V10.5a.5.5 0 0 0 .5.5h3.975a.5.5 0 0 0 0-1H6.707l4.096-4.096a.5.5 0 1 0-.707-.707z'/%3E%3C/svg%3E");
    width: 40px;
    height: auto;
}

.arrow-up-right-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-arrow-up-right-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M14 0a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h12zM5.904 10.803 10 6.707v2.768a.5.5 0 0 0 1 0V5.5a.5.5 0 0 0-.5-.5H6.525a.5.5 0 1 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 .707.707z'/%3E%3C/svg%3E");
    width: 40px;
    height: auto;
}

.loading-icon{
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' fill='lightgrey' class='bi bi-loading' viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M 8,0 A 8,8 0 0 0 0,8 8,8 0 0 0 8,16 8,8 0 0 0 16,8 H 13.380859 A 5.3799834,5.3799834 0 0 1 8,13.380859 5.3799834,5.3799834 0 0 1 2.6191406,8 5.3799834,5.3799834 0 0 1 8,2.6191406 Z' /%3E%3C/svg%3E%0A");
    width: 40px;
    height: auto;
    animation: loading-rotation 1s infinite linear;
}

@keyframes loading-rotation {
    0%{ transform: rotate(0deg); }
    25%{ transform: rotate(90deg); }
    50%{ transform: rotate(180deg); }
    75%{ transform: rotate(270deg); }
    100%{ transform: rotate(360deg); }
}

.arrow-down-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-chevron-up' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z'/%3E%3C/svg%3E");
    width: 16px;
    height: auto;
}

.arrow-up-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-chevron-down' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    width: 16px;
    height: auto;
}

.upload-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-box-arrow-in-down' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M3.5 6a.5.5 0 0 0-.5.5v8a.5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5v-8a.5.5 0 0 0-.5-.5h-2a.5.5 0 0 1 0-1h2A1.5 1.5 0 0 1 14 6.5v8a1.5 1.5 0 0 1-1.5 1.5h-9A1.5 1.5 0 0 1 2 14.5v-8A1.5 1.5 0 0 1 3.5 5h2a.5.5 0 0 1 0 1h-2z'/%3E%3Cpath fill-rule='evenodd' d='M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z'/%3E%3C/svg%3E");
    width: 40px;
    height: auto;
}

.zoom-in {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-zoom-in' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z'/%3E%3Cpath d='M10.344 11.742c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1 6.538 6.538 0 0 1-1.398 1.4z'/%3E%3Cpath fill-rule='evenodd' d='M6.5 3a.5.5 0 0 1 .5.5V6h2.5a.5.5 0 0 1 0 1H7v2.5a.5.5 0 0 1-1 0V7H3.5a.5.5 0 0 1 0-1H6V3.5a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E");;
    width: 34px;
    height: auto;
}

.zoom-out {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-zoom-out' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z'/%3E%3Cpath d='M10.344 11.742c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1 6.538 6.538 0 0 1-1.398 1.4z'/%3E%3Cpath fill-rule='evenodd' d='M3 6.5a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");;
    width: 34px;
    height: auto;
}
#spanZoomLevel {
    display:flex;
    font-size:9px;
    width: 22px;
    color:white;
    height:auto;
    align-items: center;
    justify-content: center;
}

.hand-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightgrey' class='bi bi-hand-index-thumb-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8.5 1.75v2.716l.047-.002c.312-.012.742-.016 1.051.046.28.056.543.18.738.288.273.152.456.385.56.642l.132-.012c.312-.024.794-.038 1.158.108.37.148.689.487.88.716.075.09.141.175.195.248h.582a2 2 0 0 1 1.99 2.199l-.272 2.715a3.5 3.5 0 0 1-.444 1.389l-1.395 2.441A1.5 1.5 0 0 1 12.42 16H6.118a1.5 1.5 0 0 1-1.342-.83l-1.215-2.43L1.07 8.589a1.517 1.517 0 0 1 2.373-1.852L5 8.293V1.75a1.75 1.75 0 0 1 3.5 0z'/%3E%3C/svg%3E");
    width: 24px;
    height: auto;
}

.fx-icon {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' aria-hidden='true' name='product-fx'%3E%3Cpath fill='lightgrey' d='M14.8 12.69 11.9 8h2.35l1.91 3.1L18.84 8h2.64l-4.21 4.89L20.42 18h-2.35l-2.18-3.52L12.86 18h-2.64l4.58-5.31ZM12.28 4H4l-1 6.85L1.94 18h2.02l.9-6H9l.27-2H5.15l.58-4h6.28l.27-2Z'%3E%3C/path%3E%3C/svg%3E");
    width: 24px;
    height: auto;
}