
.icon {
	width: 16px;
	height: 16px;
	display: inline-block;
	position: relative;
	vertical-align: text-bottom;
	flex-shrink: 0;
	cursor:pointer;
	background-color: var(--bg_icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	-webkit-mask-position: center;
	mask-size: contain;
	mask-position: center;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.menu .icon {
	width: 18px;
	height: 18px;
}

.toolbar.active  .icon, .menu.active .icon { background-color: var(--bg_icon-active); }

.nav_bar .icon, button .icon {
	width: 20px;
	height: 20px;
}

header .icon {
	width: 20px;
	height: 20px;
	background-color: white;
}

.active  .icon { background-color: var(--bg_icon-active); }
.icon--inactive {background-color:var(--bg_icon-inactive); !important; cursor:default;}

.icon-arrow {
	-webkit-mask-image: url('img/icons/arrow.svg');
	mask-image: url('img/icons/arrow.svg');
	width: 16px !important;
	height: 16px !important;
}

.icon-add-folder {
	-webkit-mask-image: url('img/icons/add-folder.svg');
	mask-image: url('img/icons/add-folder.svg');
}

.icon-upload {
	-webkit-mask-image: url('img/icons/upload.svg');
	mask-image: url('img/icons/upload.svg');
}

.icon-ssh {
	-webkit-mask-image: url('img/icons/ssh.svg');
	mask-image: url('img/icons/ssh.svg');
}

.icon-test-dns {
	-webkit-mask-image: url('img/icons/test-dns.svg');
	mask-image: url('img/icons/test-dns.svg');
}

.icon-domain-on {
	-webkit-mask-image: url('img/icons/domain-on.svg');
	mask-image: url('img/icons/domain-on.svg');
}

.icon-test-dns {
	background: url('./img/icons/test-dns.svg') no-repeat center / contain;
	background-color: transparent !important;
}

.icon-domain-off {
	-webkit-mask-image: url('img/icons/domain-off.svg');
	mask-image: url('img/icons/domain-off.svg');
}

.icon-arrows-rotate {
	-webkit-mask-image: url('img/icons/arrows-rotate.svg');
	mask-image: url('img/icons/arrows-rotate.svg');
}

.icon-key-add {
	-webkit-mask-image: url('img/icons/key-add.svg');
	mask-image: url('img/icons/key-add.svg')
}

.icon-key-del {
	-webkit-mask-image: url('img/icons/key-del.svg');
	mask-image: url('img/icons/key-del.svg')
}


.icon-search {
	-webkit-mask-image: url('img/icons/search.svg');
	mask-image: url('img/icons/search.svg');
}


.icon-add-file {
	-webkit-mask-image: url('img/icons/add-file.svg');
	mask-image: url('img/icons/add-file.svg');
}

.icon-eye {
	-webkit-mask-image: url('img/icons/eye.svg');
	mask-image: url('img/icons/eye.svg');
}

.icon-eye-slash {
	-webkit-mask-image: url('./img/icons/eye-slash.svg');
	mask-image: url('./img/icons/eye-slash.svg');
}

.icon-rotate {
	-webkit-mask-image: url('img/icons/rotate.svg');
	mask-image: url('img/icons/rotate.svg');
}

.icon-home {
	-webkit-mask-image: url('./img/icons/home.svg');
	mask-image: url('./img/icons/home.svg');
}

.icon-feedback {
	-webkit-mask-image: url('./img/icons/feedback.svg');
	mask-image: url('./img/icons/feedback.svg');
}

.icon-theme-toggle {
	background: url('./img/icons/theme_toggle.svg') no-repeat center / contain;
	background-color: transparent !important;
}

.icon-xmark {
	-webkit-mask-image: url('./img/icons/xmark.svg');
	mask-image: url('./img/icons/xmark.svg');
	background-color: var(--color-red);
}

.icon-task {
	-webkit-mask-image: url('./img/icons/task.svg');
	mask-image: url('./img/icons/task.svg');
}

.icon-help {
	-webkit-mask-image: url('./img/icons/help.svg');
	mask-image: url('./img/icons/help.svg');
}

.icon-delete {
	-webkit-mask-image: url('./img/icons/delete.svg');
	mask-image: url('./img/icons/delete.svg');
}

.icon-toggle-off {
	-webkit-mask-image: url('./img/icons/toggle-off.svg');
	mask-image: url('./img/icons/toggle-off.svg');
	height: 13px;
	width: 26px;
}

.icon-toggle-on {
	-webkit-mask-image: url('./img/icons/toggle-on.svg');
	mask-image: url('./img/icons/toggle-on.svg');
	height: 13px;
	width: 26px;
	background-color: var(--color-green) !important;
}

.icon-update {
	-webkit-mask-image: url('./img/icons/update.svg');
	mask-image: url('./img/icons/update.svg');
}

.icon-infinity {
	-webkit-mask-image: url('./img/icons/infinity.svg');
	mask-image: url('./img/icons/infinity.svg');
	background-color: var(--text) !important;
}

.icon-folder {
	-webkit-mask-image: url('./img/icons/folder.svg');
	mask-image: url('./img/icons/folder.svg');
}

.icon-file {
	-webkit-mask-image: url('./img/icons/file.svg');
	mask-image: url('./img/icons/file.svg');
}

.icon-link {
	-webkit-mask-image: url('./img/icons/link.svg');
	mask-image: url('./img/icons/link.svg');
}

.icon-css {
	-webkit-mask-image: url('./img/icons/css.svg');
	mask-image: url('./img/icons/css.svg');
}

.icon-img {
	-webkit-mask-image: url('./img/icons/img.svg');
	mask-image: url('./img/icons/img.svg');
}

.icon-video {
	-webkit-mask-image: url('./img/icons/video.svg');
	mask-image: url('./img/icons/video.svg');
}

.icon-music {
	-webkit-mask-image: url('./img/icons/music.svg');
	mask-image: url('./img/icons/music.svg');
}

.icon-php {
	-webkit-mask-image: url('./img/icons/php.svg');
	mask-image: url('./img/icons/php.svg');
}

.icon-html {
	-webkit-mask-image: url('./img/icons/html.svg');
	mask-image: url('./img/icons/html.svg');
}

.icon-rar {
	-webkit-mask-image: url('./img/icons/rar.svg');
	mask-image: url('./img/icons/rar.svg');
}

.icon-pdf {
	-webkit-mask-image: url('./img/icons/pdf.svg');
	mask-image: url('./img/icons/pdf.svg');
}

.icon-doc {
	-webkit-mask-image: url('./img/icons/doc.svg');
	mask-image: url('./img/icons/doc.svg');
}

.icon-js {
	-webkit-mask-image: url('./img/icons/js.svg');
	mask-image: url('./img/icons/js.svg');
}

.icon-txt {
	-webkit-mask-image: url('./img/icons/txt.svg');
	mask-image: url('./img/icons/txt.svg');
}

.icon-diskette {
	-webkit-mask-image: url('./img/icons/diskette.svg');
	mask-image: url('./img/icons/diskette.svg');
}

.icon-global {
	-webkit-mask-image: url('./img/icons/domain.svg');
	mask-image: url('./img/icons/domain.svg');
}

.icon-ssl-crt {
	-webkit-mask-image: url('./img/icons/ssl-crt.svg');
	mask-image: url('./img/icons/ssl-crt.svg');
}

.icon-ssl-key {
	-webkit-mask-image: url('./img/icons/ssl-key.svg');
	mask-image: url('./img/icons/ssl-key.svg');
}

.icon-backup {
	-webkit-mask-image: url('./img/icons/backup.svg');
	mask-image: url('./img/icons/backup.svg');
}

.icon-domain {
	-webkit-mask-image: url('./img/icons/domain.svg');
	mask-image: url('./img/icons/domain.svg');
}

.icon-ftp {
	-webkit-mask-image: url('./img/icons/ftp.svg');
	mask-image: url('./img/icons/ftp.svg');
}

.icon-webftp {
	-webkit-mask-image: url('./img/icons/webftp.svg');
	mask-image: url('./img/icons/webftp.svg');
}

.icon-email {
	-webkit-mask-image: url('./img/icons/email.svg');
	mask-image: url('./img/icons/email.svg');
}

.icon-web-mail {
	-webkit-mask-image: url('./img/icons/webmail.svg');
	mask-image: url('./img/icons/webmail.svg');
}

.icon-mail-share {
	-webkit-mask-image: url('./img/icons/mail-share.svg');
	mask-image: url('./img/icons/mail-share.svg');
}

.icon-phpmyadmin {
	-webkit-mask-image: url('./img/icons/phpmyadmin.svg');
	mask-image: url('./img/icons/phpmyadmin.svg');
}

.icon-location {
	-webkit-mask-image: url('./img/icons/location.svg');
	mask-image: url('./img/icons/location.svg');
}

.icon-database {
	-webkit-mask-image: url('./img/icons/database.svg');
	mask-image: url('./img/icons/database.svg');
}

.icon-scheduler {
	-webkit-mask-image: url('./img/icons/scheduler.svg');
	mask-image: url('./img/icons/scheduler.svg');
}

.icon-scaner {
	-webkit-mask-image: url('./img/icons/scaner.svg');
	mask-image: url('./img/icons/scaner.svg');
}

.icon-stat {
	-webkit-mask-image: url('./img/icons/stat.svg');
	mask-image: url('./img/icons/stat.svg');
}

.icon-monitoring {
	-webkit-mask-image: url('./img/icons/monitoring.svg');
	mask-image: url('./img/icons/monitoring.svg');
}

.icon-log {
	-webkit-mask-image: url('./img/icons/log.svg');
	mask-image: url('./img/icons/log.svg');
}

.icon-exit {
	-webkit-mask-image: url('./img/icons/exit.svg');
	mask-image: url('./img/icons/exit.svg');
}

.icon-edit-email {
	-webkit-mask-image: url('./img/icons/editEmail.svg');
	mask-image: url('./img/icons/editEmail.svg');
}

.icon-tools {
	-webkit-mask-image: url('./img/icons/tools.svg');
	mask-image: url('./img/icons/tools.svg');
}

.icon-lock {
	-webkit-mask-image: url('./img/icons/lock.svg');
	mask-image: url('./img/icons/lock.svg');;
}

.icon-add {
	-webkit-mask-image: url('./img/icons/add.svg');
	mask-image: url('./img/icons/add.svg');;
}