:root {
    --fade-red: #F0826B;
	--status-red: 231,76,60;
	--second-red: 219,40,44;
	--third-red: 183,28,43;
	--fourth-red: 147,17,41;

    --fade-orange: #FFA949;
	--status-orange: 255,128,13;
	--second-orange: 219,98,9;
	--third-orange: 183,72,6;
	--fourth-orange: 147,49,4;

    --fade-green: #5CE088;
	--status-green: 46,204,113;
	--second-green: 33,175,107;
	--third-green: 23,146,100;
	--fourth-green: 14,118,89;

    --fade-blue: #64BBE9;
	--status-blue: 52,152,219;
	--second-blue: 38,119,188;
	--third-blue: 26,89,157;
	--fourth-blue: 16,63,127;

    --fade-purple: #B779FF;
	--status-purple: 152,77,255;
	--second-purple: 118,56,219;
	--third-purple: 87,38,183;
	--fourth-purple: 60,24,147;

    --fade-yellow: #FFDC3F;
	--status-yellow: 255,204,0;
	--second-yellow: 219,170,0;
	--third-yellow: 183,139,0;
	--fourth-yellow: 147,109,0;

	--status-black: 0,0,0;
	--second-black: 0,0,0;

	--fade-grey: #9EA9B1;
	--status-grey: 108,117,125;
	--second-grey: 78,92,107;
	--third-grey: 54,69,89;
	--fourth-grey: 34,48,72;

    --fade-white: #E3E3E3;
	--status-white: 210,210,210;
	--second-white: 190,190,190;
	--third-white: 170,170,170;
	--fourth-white: 150,150,150;

	--hover-link-light: #3f6ad8;
	--hover-link-dark: white;
	--hover-link: var(--hover-link-dark);

	--hover-transition: color 0.2s ease-in,
	                    -webkit-text-stroke-color 0.2s ease-in,
						border 0.2s ease-in,
						background-color 0.2s ease-in,
						box-shadow 0.2s ease-in,
						border-radius 0.2s ease-in;

	--dark-theme-font: rgba(225,235,245,.95);
	--light-theme-font: rgb(73,80,87);
	--primary-font: var(--dark-theme-font);
	--secondary-font: rgba(225,235,245,.7);
	--placeholder-font: #707070;
	--highlighted-font: black;
	--counter-font: white;

	--primary-background: #192231;
	--secondary-background: #24344d;
	--block-background: var(--primary-background);
	--collector-background: var(--secondary-background);
	--input-background: #f7f7f7;
	--secondary-input-background: var(--input-background);
	
	--primary-border: 1px solid #27303e;
	--secondary-border-color: #2e3f5b;
	--secondary-border: 1px solid var(--secondary-border-color);
	--menu-border: var(--primary-border);
	
	--block-shadow: 0 0.46875rem 2.1875rem rgba(4, 9, 20, 0.03), 0 0.9375rem 1.40625rem rgba(4, 9, 20, 0.03), 0 0.25rem 0.53125rem rgba(4, 9, 20, 0.05), 0 0.125rem 0.1875rem rgba(4, 9, 20, 0.03);
	--menu-bottom-shadow: none;
	--menu-top-shadow: none;

	--highcharts-background: var(--primary-background);
	--highcharts-image: none;
	--highcharts-legend-hover: #fff;
	--highcharts-color-0: #2b908f;
	--highcharts-color-1: #90ee7e;
	--highcharts-color-2: #f45b5b;
	--highcharts-color-3: #7798BF;
	--highcharts-color-4: #aaeeee;
	--highcharts-color-5: #ff9825;
	--highcharts-color-6: #eeaaee;
	--highcharts-color-7: #55BF3B;
	--highcharts-color-8: #DF5353;
	--highcharts-color-9: #d02951;
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

html, body {
    height: 100%;
}

body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: var(--primary-font);
	background-color: var(--primary-background);
	display: flex;
    flex-direction: column;
}

a {
	text-decoration: none;
	color: inherit;
}

ul, li {
    list-style: none;
}

i {
    font-size: 1.43em;
}

input,
select,
textarea {
	font-size: inherit;
	font-family: inherit;
}

textarea {
    resize: none;
}

input[type="checkbox"],
input[type="radio"] {
	cursor: pointer;
	width: 1em;
}

input[type="radio"] {
	height: 1em;
}

input[type="number"] {
   -moz-appearance: textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    display: none;
}

.double-input {
    display: flex;
    height: 2.14em;
    margin: 0 1.07em 0 0.71em;
}

.double-input input {
    width: 2.5em;
    padding: 0 0.21em;
    background-color: var(--input-background);
    border: var(--secondary-border);
    border-radius: 5px 0 0 5px;
    text-align: center;
    outline: none;
}

.double-input select {
    background-color: var(--input-background);
    border: var(--secondary-border);
    border-radius: 0 5px 5px 0;
    padding: 0 0.29em;
    border-left: none;
}

.clearfix {
	clear: both;
}

.flex-wrapper {
    display: flex;
    align-items: center;
}

.flex-right {
    display: flex;
    justify-content: flex-end;
}

.button {
    color: white;
}

.button.interactive {
	cursor: pointer;
	transition: var(--hover-transition);
}

.button.color-green:not(i), .button:not(i)[data-status="1"] {
	background: rgb(var(--status-green));
	border: 1px solid rgb(var(--status-green));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-green), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-green), 0.5);
}
i.color-green, i[data-status="1"] {
	color: rgb(var(--status-green));
}
i.button.color-green, i.button[data-status="1"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-green), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-green), 0.5);
}
.button.color-green.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="1"]:hover {
	background: rgb(var(--second-green));
	border: 1px solid rgb(var(--third-green));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-green), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-green), 0.6);
}
i.button.color-green.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="1"]:hover {
    color: rgb(var(--second-green));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-green), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-green), 0.6);
}
.button.color-green.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="1"]:active {
	background: rgb(var(--third-green));
	border: 1px solid rgb(var(--fourth-green));
	box-shadow: none;
}
i.button.color-green.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="1"]:active {
    color: rgb(var(--third-green));
    text-shadow: none;
}

.button.color-blue:not(i), .button:not(i)[data-status="2"] {
	background: rgb(var(--status-blue));
	border: 1px solid rgb(var(--status-blue));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-blue), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-blue), 0.5);
}
i.color-blue, i[data-status="2"] {
	color: rgb(var(--status-blue));
}
i.button.color-blue, i.button[data-status="2"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-blue), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-blue), 0.5);
}
.button.color-blue.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="2"]:hover {
	background: rgb(var(--second-blue));
	border: 1px solid rgb(var(--third-blue));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-blue), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-blue), 0.6);
}
i.button.color-blue.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="2"]:hover {
    color: rgb(var(--second-blue));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-blue), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-blue), 0.6);
}
.button.color-blue.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="2"]:active {
	background: rgb(var(--third-blue));
	border: 1px solid rgb(var(--fourth-blue));
	box-shadow: none;
}
i.button.color-blue.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="2"]:active {
    color: rgb(var(--third-blue));
    text-shadow: none;
}

.button.color-orange:not(i), .button:not(i)[data-status="3"] {
	background: rgb(var(--status-orange));
	border: 1px solid rgb(var(--status-orange));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-orange), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-orange), 0.5);
}
i.color-orange, i[data-status="3"] {
	color: rgb(var(--status-orange));
}
i.button.color-orange, i.button[data-status="3"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-orange), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-orange), 0.5);
}
.button.color-orange.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="3"]:hover {
	background: rgb(var(--second-orange));
	border: 1px solid rgb(var(--third-orange));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-orange), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-orange), 0.6);
}
i.button.color-orange.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="3"]:hover {
    color: rgb(var(--second-orange));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-orange), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-orange), 0.6);
}
.button.color-orange.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="3"]:active {
	background: rgb(var(--third-orange));
	border: 1px solid rgb(var(--fourth-orange));
	box-shadow: none;
}
i.button.color-orange.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="3"]:active {
    color: rgb(var(--third-orange));
    text-shadow: none;
}

.button.color-red:not(i), .button:not(i)[data-status="4"] {
	background: rgb(var(--status-red));
	border: 1px solid rgb(var(--status-red));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-red), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-red), 0.5);
}
i.color-red, i[data-status="4"] {
    color: rgb(var(--status-red));
}
i.button.color-red, i.button[data-status="4"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-red), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-red), 0.5);
}
.button.color-red.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="4"]:hover {
	background: rgb(var(--second-red));
	border: 1px solid rgb(var(--third-red));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-red), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-red), 0.6);
}
i.button.color-red.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="4"]:hover {
    color: rgb(var(--second-red));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-red), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-red), 0.6);
}
.button.color-red.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="4"]:active {
	background: rgb(var(--third-red));
	border: 1px solid rgb(var(--fourth-red));
	box-shadow: none;
}
i.button.color-red.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="4"]:active {
    color: rgb(var(--third-red));
    text-shadow: none;
}

.button.color-purple:not(i), .button:not(i)[data-status="5"] {
	background: rgb(var(--status-purple));
	border: 1px solid rgb(var(--status-purple));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-purple), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-purple), 0.5);
}
i.color-purple, i[data-status="5"] {
	color: rgb(var(--status-purple));
}
i.button.color-purple, i.button[data-status="5"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-purple), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-purple), 0.5);
}
.button.color-purple.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="5"]:hover {
	background: rgb(var(--second-purple));
	border: 1px solid rgb(var(--third-purple));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-purple), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-purple), 0.6);
}
i.button.color-purple.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="5"]:hover {
    color: rgb(var(--second-purple));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-purple), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-purple), 0.6);
}
.button.color-purple.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="5"]:active {
	background: rgb(var(--third-purple));
	border: 1px solid rgb(var(--fourth-purple));
	box-shadow: none;
}
i.button.color-purple.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="5"]:active {
    color: rgb(var(--third-purple));
    text-shadow: none;
}

.button.color-grey:not(i), .button:not(i)[data-status="6"] {
	background: rgb(var(--status-grey));
	border: 1px solid rgb(var(--status-grey));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-grey), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-grey), 0.5);
}
i.color-grey, i[data-status="6"] {
	color: rgb(var(--status-grey));
}
i.button.color-grey, i.button[data-status="6"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-grey), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-grey), 0.5);
}
.button.color-grey.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="6"]:hover {
	background: rgb(var(--second-grey));
	border: 1px solid rgb(var(--third-grey));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-grey), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-grey), 0.6);
}
i.button.color-grey.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="6"]:hover {
    color: rgb(var(--second-grey));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-grey), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-grey), 0.6);
}
.button.color-grey.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="6"]:active {
	background: rgb(var(--third-grey));
	border: 1px solid rgb(var(--fourth-grey));
	box-shadow: none;
}
i.button.color-grey.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="6"]:active {
    color: rgb(var(--third-grey));
    text-shadow: none;
}

.button.color-black:not(i), .button:not(i)[data-status="7"] {
	background: black;
	border: 1px solid black;
	box-shadow: 0 0.125rem 0.625rem black, 0.4), 0 0.0625rem 0.125rem black, 0.5);
}
i.color-black, i[data-status="7"] {
	color: black;
}
i.button.color-black, i.button[data-status="7"] {
	text-shadow: 0 0.125rem 0.625rem black, 0.4), 0 0.0625rem 0.125rem black, 0.5);
}
.button.color-black.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="7"]:hover {
	background: black;
	border: 1px solid black;
	box-shadow: 0 0.125rem 0.625rem black, 0.5), 0 0.0625rem 0.125rem black, 0.6);
}
i.button.color-black.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="7"]:hover {
    color: black;
    text-shadow: 0 0.125rem 0.625rem black, 0.5), 0 0.0625rem 0.125rem black, 0.6);
}
.button.color-black.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="7"]:active {
	background: black;
	border: 1px solid black;
	box-shadow: none;
}
i.button.color-black.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="7"]:active {
    color: black;
    text-shadow: none;
}

.button:not(i).color-yellow, .button:not(i)[data-status="8"] {
    color: black;
}
.button.color-yellow:not(i), .button:not(i)[data-status="8"] {
	background: rgb(var(--status-yellow));
	border: 1px solid rgb(var(--status-yellow));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-yellow), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-yellow), 0.5);
}
i.color-yellow, i[data-status="8"] {
	color: rgb(var(--status-yellow));
}
i.button.color-yellow, i.button[data-status="8"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-yellow), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-yellow), 0.5);
}
.button.color-yellow.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="8"]:hover {
	background: rgb(var(--second-yellow));
	border: 1px solid rgb(var(--third-yellow));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-yellow), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-yellow), 0.6);
}
i.button.color-yellow.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="8"]:hover {
    color: rgb(var(--second-yellow));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-yellow), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-yellow), 0.6);
}
.button.color-yellow.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="8"]:active {
	background: rgb(var(--third-yellow));
	border: 1px solid rgb(var(--fourth-yellow));
	box-shadow: none;
}
i.button.color-yellow.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="8"]:active {
    color: rgb(var(--third-yellow));
    text-shadow: none;
}

.button:not(i).color-white, .button:not(i)[data-status="white"] {
    color: black;
}
.button.color-white:not(i), .button:not(i)[data-status="white"] {
	background: rgb(var(--status-white));
	border: 1px solid rgb(var(--status-white));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-white), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-white), 0.5);
}
i.color-white, i[data-status="white"] {
	color: rgb(var(--status-white));
}
i.button.color-white, i.button[data-status="white"] {
	text-shadow: 0 0.125rem 0.625rem rgba(var(--status-white), 0.4), 0 0.0625rem 0.125rem rgba(var(--status-white), 0.5);
}
.button.color-white.interactive:not(i):not([disabled]):hover, .button.interactive:not(i):not([disabled])[data-status="white"]:hover {
	background: rgb(var(--second-white));
	border: 1px solid rgb(var(--third-white));
	box-shadow: 0 0.125rem 0.625rem rgba(var(--status-white), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-white), 0.6);
}
i.button.color-white.interactive:not([disabled]):hover, i.button.interactive:not([disabled])[data-status="white"]:hover {
    color: rgb(var(--second-white));
    text-shadow: 0 0.125rem 0.625rem rgba(var(--status-white), 0.5), 0 0.0625rem 0.125rem rgba(var(--status-white), 0.6);
}
.button.color-white.interactive:not(i):not([disabled]):active, .button.interactive:not(i):not([disabled])[data-status="white"]:active {
	background: rgb(var(--third-white));
	border: 1px solid rgb(var(--fourth-white));
	box-shadow: none;
}
i.button.color-white.interactive:not([disabled]):active, i.button.interactive:not([disabled])[data-status="white"]:active {
    color: rgb(var(--third-white));
    text-shadow: none;
}

.loader {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

.loader.default {
    border:3px solid #3c3c3c;
    border-radius:50%;
    box-shadow: 0px 0px 0.71em rgba(0,0,0,.5), inset 0px 0px 0.57em rgba(0,0,0,.5);
    width:2.14em;
    height:2.14em;
    background:transparent;
}
.loader.default.small {
    width: 1.4em;
    height: 1.4em;
}
.total-alerts-count .loader.default.small {
    position: relative;
    transform: inherit;
    top: auto;
    left: auto;
    z-index: 9999;
}
.loader.default:before {
    content:'';
    position:absolute;
    top:-3px;
    left:-3px;
    width:100%;
    height:100%;
    border:3px solid transparent;
    border-top:3px solid rgb(var(--status-green));
    border-right:3px solid rgb(var(--status-green));
    border-radius:50%;
    animation:animateC 1s linear infinite;
}
.loader.default span {
    display:block;
    position:absolute;
    top:calc(50% - 2px);
    left:50%;
    width:50%;
    height:4px;
    background:transparent;
    transform-origin:left;
    animation:animate 1s linear infinite;
}
.loader.default span:before {
    content:'';
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background:rgb(var(--status-green));
    top:-4px;
    right:-5px;
    box-shadow:0 0 1.43em rgb(var(--status-green));
}

.loader.ball-pulse > div,
.loader.ball-grid-pulse > div,
.loader.ball-pulse-rise > div,
.loader.ball-rotate > div, .loader.ball-rotate > div:before, .loader.ball-rotate > div:after,
.loader.ball-zig-zag-deflect > div,
.loader.ball-triangle-path > div,
.loader.ball-spin-fade > div {
    background-color: rgb(var(--status-green));
    box-shadow: 0 0 1em rgb(var(--status-green));
    width: 1em;
    height: 1em;
    border-radius: 100%;
    margin: 0.14em;
    animation-fill-mode: both;
}

.loader.ball-pulse {
    display: flex;
}
.loader.ball-pulse > div {
    margin: 0.28em;
}
.loader.ball-pulse > div:nth-child(1) {
    animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.loader.ball-pulse > div:nth-child(2) {
    animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.loader.ball-pulse > div:nth-child(3) {
    animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}

.loader.ball-grid-pulse {
    display: grid;
    grid-template-columns: auto auto auto;
}
.loader.ball-grid-pulse > div {
    animation-name: ball-grid-pulse;
    animation-iteration-count: infinite;
    animation-delay: 0s;
}
.loader.ball-grid-pulse > div:nth-child(1) {
    animation-delay: 0.22s;
    animation-duration: 0.9s;
}
.loader.ball-grid-pulse > div:nth-child(2) {
    animation-delay: 0.64s;
    animation-duration: 1s;
}
.loader.ball-grid-pulse > div:nth-child(3) {
    animation-delay: -0.15s;
    animation-duration: 0.63s;
}
.loader.ball-grid-pulse > div:nth-child(4) {
    animation-delay: -0.03s;
    animation-duration: 1.24s;
}
.loader.ball-grid-pulse > div:nth-child(5) {
    animation-delay: 0.08s;
    animation-duration: 1.37s;
}
.loader.ball-grid-pulse > div:nth-child(6) {
    animation-delay: 0.43s;
    animation-duration: 1.55s;
}
.loader.ball-grid-pulse > div:nth-child(7) {
    animation-delay: 0.05s;
    animation-duration: 0.7s;
}
.loader.ball-grid-pulse > div:nth-child(8) {
    animation-delay: 0.05s;
    animation-duration: 0.97s;
}
.loader.ball-grid-pulse > div:nth-child(9) {
    animation-delay: 0.3s;
    animation-duration: 0.63s;
}

.loader.ball-pulse-rise > div {
    display: inline-block;
    animation-duration: 1s;
    animation-timing-function: cubic-bezier(0.15, 0.46, 0.9, 0.6);
    animation-iteration-count: infinite;
    animation-delay: 0s;
}
.loader.ball-pulse-rise > div:nth-child(2n-1) {
    animation-name: ball-pulse-rise-odd;
}
.loader.ball-pulse-rise > div:nth-child(2n) {
    animation-name: ball-pulse-rise-even;
}

.loader.ball-rotate > div {
    position: relative;
}
.loader.ball-rotate > div:first-child {
    animation: rotate 1s 0s cubic-bezier(0.7, -0.13, 0.22, 0.86) infinite;
}
.loader.ball-rotate > div:before,
.loader.ball-rotate > div:after {
    margin: 0;
    content: "";
    position: absolute;
    opacity: 0.8;
    top: 0;
}
.loader.ball-rotate > div:before {
    left: -1.86em;
}
.loader.ball-rotate > div:after {
    left: 1.86em;
}

.loader.ball-zig-zag-deflect {
    transform: translate(-1em, -1em);
}
.loader.ball-zig-zag-deflect > div {
    position: absolute;
    margin-left: 1em;
    top: 0.29em;
    left: -0.5em;
}
.loader.ball-zig-zag-deflect > div:first-child {
    animation: ball-zig-deflect 1.5s 0s infinite linear;
}
.loader.ball-zig-zag-deflect > div:last-child {
    animation: ball-zag-deflect 1.5s 0s infinite linear;
}

.loader.ball-triangle-path {
    transform: translate(-2.355em, -2.355em);
}
.loader.ball-triangle-path > div {
    position: absolute;
    animation-delay: 0s;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
.loader.ball-triangle-path > div:nth-of-type(1) {
    top: 3.57em;
}
.loader.ball-triangle-path > div:nth-child(1) {
    animation-name: ball-triangle-path-1;
}
.loader.ball-triangle-path > div:nth-of-type(2) {
    left: 1.79em;
}
.ball-triangle-path > div:nth-child(2) {
    animation-name: ball-triangle-path-2;
}
.loader.ball-triangle-path > div:nth-of-type(3) {
    top: 3.57em;
    left: 3.57em;
}
.loader.ball-triangle-path > div:nth-child(3) {
    animation-name: ball-triangle-path-3;
}

.loader.ball-spin-fade {
    transform: translate(-0.64em,-0.64em);
}
.loader.ball-spin-fade > div {
    position: absolute;
}
.loader.ball-spin-fade > div:nth-child(1) {
    top: 1.78571em;
    left: 0;
    animation: ball-spin-fade 1s -0.96s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(2) {
    top: 1.21753em;
    left: 1.21753em;
    animation: ball-spin-fade 1s -0.84s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(3) {
    top: 0;
    left: 1.78571em;
    animation: ball-spin-fade 1s -0.72s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(4) {
    top: -1.21753em;
    left: 1.21753em;
    animation: ball-spin-fade 1s -0.6s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(5) {
    top: -1.78571em;
    left: 0;
    animation: ball-spin-fade 1s -0.48s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(6) {
    top: -1.21753em;
    left: -1.21753em;
    animation: ball-spin-fade 1s -0.36s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(7) {
    top: 0;
    left: -1.78571em;
    animation: ball-spin-fade 1s -0.24s infinite linear;
}
.loader.ball-spin-fade > div:nth-child(8) {
    top: 1.21753em;
    left: -1.21753em;
    animation: ball-spin-fade 1s -0.12s infinite linear;
}

.button-loader-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

[disabled]:not(.forbidden),
.disabled-control:not(.forbidden) {
    opacity: 0.6 !important;
    cursor: wait !important;
}

.disabled-control > * {
    pointer-events: none;
}

.disabled-btn {
    pointer-events: none;
    opacity: 0.4;
}

#header {
    background-color: var(--block-background);
	border-bottom: var(--menu-border);
	box-shadow: var(--menu-bottom-shadow);
	padding: 0.36em 0.71em;
	position: relative;
}

#header .main-menu,
#header .secondary-menu {
	display: flex;
	flex-wrap: wrap;
	max-width: calc(50% - 6.05em);
}

#header .main-menu {
    float: left;
}

#header .secondary-menu {
    float: right;
    justify-content: flex-end;
}

#header .site-logo {
	font-size: 2.29em;
	padding: 0 1.78em 0 calc(1.43em / 2.29);
	display: inline-block;
}

#header .menu-item,
#header .menu-link,
#header .menu-info {
	white-space: nowrap;
	display: flex;
	align-items: center;
}

#header .menu-info {
    color: var(--secondary-font);
    padding: 0.36em 0 0.36em 1.07em;
    margin-left: 0.36em;
}

#header .menu-link,
#header .user-menu {
	padding: 0.36em 1.07em;
    margin: 0 0.36em;
	border: 1px solid transparent;
}

#header .menu-link {
	cursor: pointer;
	border-radius: 50px;
	transition: var(--hover-transition);
}

#header .menu-link:hover,
#header .menu-link.active {
    color: var(--highlighted-font);
    background-color: var(--primary-font);
}

.menu-link .menu-label,
.menu-info {
	font-size: 1.14em;
}

#header .menu-link i {
    font-size: 1.6em;
	margin-right: calc(0.71em / 1.6);
}

#header .collector-info {
    border-radius: 5px;
    border: var(--menu-border);
    background-color: var(--collector-background);
}

#header .collector-info .entity-status:not(:last-child) {
    margin-right: 0.36em;
}

#header .user-menu {
	display: inline-block;
    padding-right: 1.07em;
    margin-right: 0;
}

#header .user-menu .user-link {
	display: flex;
    align-items: center;
    line-height: 1.6em;
}

#header .user-menu .user-link i {
	margin-left: 0.36em;
}

#header .user-menu .dropdown-items-list {
    display: none;
    position: absolute;
    right: 0;
    z-index: 1050;
    border-radius: 0 0 0 5px;
    padding-top: calc(0.71em + 2px);
}

#header .user-menu:hover .dropdown-items-list {
	display: block;
}

#header .user-menu .dropdown-items-list .list-background {
    padding: 1.07em 1.43em 1.43em 1.43em;
    border-radius: 0 0 0 5px;
    background: var(--block-background);
    box-shadow: -0.36em 0.36em 1.07em rgba(4, 9, 20, 0.14);
}

#header .user-menu .dropdown-items-list .alerts-overview {
    display: flex;
    justify-content: space-between;
    column-gap: 0.71em;
}

#header .user-menu .dropdown-items-list .alerts-overview .category {
    display: flex;
    align-items: center;
    cursor: pointer;
}

#header .user-menu .dropdown-items-list .alerts-overview .category .total-alerts-count {
    margin-left: 0.71em;
    line-height: 1.4em;
}

#header .user-menu .dropdown-items-list .alerts-overview .category:hover .total-alerts-count {
    background: rgb(var(--second-red));
}

#header .user-menu .dropdown-items-list .alerts-overview .category:hover i {
    background-position: 0 100% !important;
}

#header .user-menu .dropdown-items-list .main-button {
    max-width: none;
    width: 100%;
}

#header .user-menu .dropdown-items-list .list-background > *:not(:first-child) {
    margin-top: 0.86em;
}

#header .user-menu .dropdown-items-list .list-background > .main-button {
    margin-top: calc(0.86em / 1.21);
}

#header .user-menu .dropdown-items-list .restricted-visibility .label {
    margin-right: 0.36em;
}

.messages-list,
.alerts-message-list {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.messages-list {
    position: absolute;
    top: 0;
    z-index: 1000;
    left: 50%;
    transform: translateX(-50%);
    max-width: 100%;
}

#page-messages.messages-list {
    padding: 0.36em 0.36em 0 0.36em;
}

.dialog-modal-wrapper .messages-list {
    padding: 0.18em 0.71em 0.5em 0.71em;
}

.dialog-modal-wrapper .alerts-message-list {
    padding: 0 0.71em 0 0.71em;
}

.message {
    background: rgb(var(--status-grey));
    border: 1px solid rgb(var(--second-grey));
    border-radius: 5px;
    margin: 0.36em 0.71em;
    padding: 0.36em 1.43em;
    color: white;
    font-weight: bold;
    display: flex;
    align-items: center;
    max-width: 100%;
}

.messages-list .message {
    white-space: nowrap;
    box-shadow: var(--block-shadow);
}

.message[data-status="8"] {
    background: rgb(var(--second-yellow));
    border-color: rgb(var(--third-yellow));
}

.message.error,
.message[data-status="4"] {
    background: rgb(var(--status-red));
    border-color: rgb(var(--second-red));
}

.message.warning,
.message[data-status="3"] {
    background: rgb(var(--status-orange));
    border-color: rgb(var(--second-orange));
}

.message[data-status="5"] {
    background: rgb(var(--status-purple));
    border-color: rgb(var(--second-purple));
}

.message[data-status="2"] {
    background: rgb(var(--status-blue));
    border-color: rgb(var(--second-blue));
}

.message.info,
.message[data-status="1"] {
    background: rgb(var(--status-green));
    border-color: rgb(var(--second-green));
}

.message .message-content {
    overflow: hidden;
    text-overflow: ellipsis;
}

.message .dialog-close {
    margin-left: calc(1.43em / 1.43);
    transform: translateX(50%);
}

.message.alerts-message[data-status="8"] {
    animation: yellow-blink 2s linear infinite;
}

.message.alerts-message[data-status="4"] {
    animation: red-blink 2s linear infinite;
}

.message.alerts-message[data-status="3"] {
    animation: orange-blink 2s linear infinite;
}

.message.alerts-message[data-status="5"] {
    animation: purple-blink 2s linear infinite;
}

.message.alerts-message[data-status="6"] {
    animation: grey-blink 2s linear infinite;
}

.message.alerts-message i.icon {
    font-size: 1.7em;
    margin-right: calc(1.43em / 1.7);
}

.message.alerts-message .alerts-wrapper {
    max-height: 6.5em;
    overflow: hidden;
    padding-right: 1.07em;
    padding-bottom: 1px;
}

.message.alerts-message .alerts-wrapper .alert:not(:last-child) {
    border-bottom: 1px solid white;
    padding-bottom: 0.36em;
    margin-bottom: 0.36em;
}

.message.alerts-message .alert-message {
    font-size: 1.1em;
}

.message.alerts-message .alert-detail-link {
	background: linear-gradient(to right, white, white 50%, #dedede 50%);
}

.message.alerts-message .alert-time {
    color: #dedede;
    margin-top: 0.36em;
}

#footer {
    background-color: var(--block-background);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	height: 3.57em;
	width: 100%;
	border-top: var(--menu-border);
	box-shadow: var(--menu-top-shadow);
	font-size: .9em;
	flex-shrink: 0;
}

#footer .footer-img {
	position: absolute;
	bottom: 1.79em;
	right: 1.79em;
}

#footer .footer-img img {
	box-shadow: var(--block-shadow);
	border-radius: 6px;
}

#page-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-items: start;
	justify-content: space-evenly;
	flex-grow: 1;
	flex-wrap: wrap;
    padding: 1.43em 3.57em 5em 3.57em;
    position: relative;
}

.block-title {
	font-size: 1.07em;
}

.problem-item {
	border-radius: 5px;
	background-color: var(--primary-background);
	padding: 0.71em;
	margin-top: 0.71em;
}

.problem-item:first-child {
	margin-top: 0;
}

.problem-item[data-status="8"] {
	box-shadow: rgb(var(--status-yellow)) 0.21em 0.21em 0.43em 0px inset, rgb(var(--status-yellow)) -0.21em -0.21em 0.43em 0px inset;
}
.problem-item[data-status="4"] {
	box-shadow: rgb(var(--status-red)) 0.21em 0.21em 0.43em 0px inset, rgb(var(--status-red)) -0.21em -0.21em 0.43em 0px inset;
}
.problem-item[data-status="3"] {
	box-shadow: rgb(var(--status-orange)) 0.21em 0.21em 0.43em 0px inset, rgb(var(--status-orange)) -0.21em -0.21em 0.43em 0px inset;
}
.problem-item[data-status="5"] {
	box-shadow: rgb(var(--status-purple)) 0.21em 0.21em 0.43em 0px inset, rgb(var(--status-purple)) -0.21em -0.21em 0.43em 0px inset;
}
.problem-item[data-status="2"] {
	box-shadow: rgb(var(--status-blue)) 0.21em 0.21em 0.43em 0px inset, rgb(var(--status-blue)) -0.21em -0.21em 0.43em 0px inset;
}

.content-link,
.complex-content-link,
.simple-link,
.icon-link,
.site-logo {
	transition: background-position 275ms ease;
	cursor: pointer;
	white-space: nowrap;
	background-clip: text !important;
	-webkit-background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	background-size: 200% 100% !important;
	background-position: 100% !important;
}

.content-link,
.complex-content-link,
.icon-link,
.site-logo,
.simple-link {
    background: linear-gradient(to right, var(--hover-link), var(--hover-link) 50%, var(--primary-font) 50%);
}

.content-link:hover,
.complex-content-link:hover,
.simple-link:hover,
.icon-link:hover,
.site-logo:hover {
    background-position: 0 100% !important;
}

.content-link,
.complex-content-link > *:not(i) {
	box-shadow: 0px 1px 0px var(--primary-font);
    overflow: hidden;
    max-width: 12.5em;
    transition: background-position 275ms ease, box-shadow 275ms ease;
    margin-bottom: 1px;
}

.content-link:hover,
.complex-content-link:hover > *:not(i) {
    box-shadow: 0px 1px 0px var(--hover-link);
}

.content-link {
    display: inline-block;
}

.complex-content-link {
	display: flex;
	align-items: center;
	font-size: 1.07em;
    overflow: hidden;
    gap: 0.36em;
}

.entity-table td .complex-content-link {
    width: fit-content;
    margin: 0 auto;
}

.complex-content-link > i {
    padding: 1px 0 0 1px;
}

.problem-item .problem-header-wrapper {
	padding: 0 0.36em 0.36em 0.36em;
	display: inline-block;
}

.problem-item .problem-header i {
	font-size: 1.71em;
	margin-right: calc(0.71em / 1.71);
}

.problem-item .problem-header .problem-title {
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 1.07em;
	font-weight: bold;
}

.problem-item .problem-body {
	max-height: 7.86em;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 0 0.36em;
}

.subnet-filter-table {
    position: relative;
}

.subnet-filter-table table {
    border-collapse: collapse;
}

.subnet-filter-table .element {
    width: 4.5em;
    font-size: 1.3em;
    color: white;
    font-weight: 400;
    text-align: center;
    padding: calc(0.36em / 1.3) 0;
    user-select: none;
    background-color: rgb(var(--status-grey));
    border: 1px solid rgb(var(--second-grey));
    border-radius: 5px;
}

.subnet-filter-table .element.multidropdown {
    padding: calc(0.36em / 1.3);
}

.subnet-filter-table tr > *:not(:last-child) .element {
    margin-right: calc(0.29em / 1.3);
}

.subnet-filter-table thead tr .element,
.subnet-filter-table tbody tr:not(:last-child) .element {
    margin-bottom: calc(0.29em / 1.3);
}

.subnet-filter-table .element.region,
.subnet-filter-table .element.band,
.subnet-filter-table .element.sub-band {
    font-weight: bold;
}

.subnet-filter-table .element[data-entity-id]:not(.disabled) {
    cursor: pointer;
    transition: var(--hover-transition);
}

.subnet-filter-table .element:not(.checked),
.subnet-filter-table .element.disabled {
    opacity: 0.5;
}

.subnet-filter-table .element[data-status="1"] {
    background-color: rgb(var(--status-green));
    border-color: rgb(var(--second-green));
}
.subnet-filter-table .element:not(.disabled)[data-entity-id][data-status="1"]:hover {
	background-color: rgb(var(--second-green));
	border-color: rgb(var(--third-green));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="1"]:active {
	background-color: rgb(var(--third-green));
	border-color: rgb(var(--fourth-green));
}

.subnet-filter-table .element[data-status="5"] {
    background-color: rgb(var(--status-purple));
    border-color: rgb(var(--second-purple));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="5"]:hover {
	background-color: rgb(var(--second-purple));
	border-color: rgb(var(--third-purple));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="5"]:active {
	background-color: rgb(var(--third-purple));
	border-color: rgb(var(--fourth-purple));
}

.subnet-filter-table .element[data-status="3"] {
    background-color: rgb(var(--status-orange));
    border-color: rgb(var(--second-orange));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="3"]:hover {
	background-color: rgb(var(--second-orange));
	border-color: rgb(var(--third-orange));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="3"]:active {
	background-color: rgb(var(--third-orange));
	border-color: rgb(var(--fourth-orange));
}

.subnet-filter-table .element[data-status="4"] {
    background-color: rgb(var(--status-red));
    border-color: rgb(var(--second-red));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="4"]:hover {
	background-color: rgb(var(--second-red));
	border-color: rgb(var(--third-red));
}
.subnet-filter-table .element[data-entity-id]:not(.disabled)[data-status="4"]:active {
	background-color: rgb(var(--third-red));
	border-color: rgb(var(--fourth-red));
}

.entity-alerts-list .entity-alert {
	margin-top: 0.71em;
	display: flex;
	align-items: center;
	padding-top: 0.36em;
	border-top: var(--primary-border);
}

.entity-alerts-list .entity-alert:first-child {
	margin-top: 0;
}

.entity-alerts-list .entity-alert:last-child {
	margin-bottom: 0.36em;
}

.jquery-modal .entity-alerts-list .entity-alert {
	border-top: var(--secondary-border);
}

.entity-alert .reason-wrapper {
	overflow: hidden;
}

.entity-alerts-list .entity-alert .reason-wrapper {
	margin-left: 0.71em;
}

.entity-alert .reason-wrapper .alert-reason {
    overflow: hidden;
}

.alert-reason .alert-message {
    vertical-align: middle;
}

.reason-wrapper .alert-time {
	margin-top: 0.36em;
	color: var(--secondary-font);
}

.entity-alerts-list .entity-alert .alert-time {
	font-size: 0.93em;
}

.empty-message {
    display: flex;
	align-items: center;
	justify-content: center;
}

.empty-message i {
	color: rgb(var(--status-green));
	margin-right: 0.36em;
}

#main-feed .empty-message,
.jquery-modal .empty-message {
    font-size: 1.14em;
}

/* Smooth-scrollbar styling */
div.scrollbar-track {
	background: none;
}

div.scrollbar-track-y {
	width: 0.57em;
}

.scrollbar-track .scrollbar-thumb {
	background-color: var(--primary-font);
	opacity: 0.6;
	cursor: grab;
}

.scrollbar-track .scrollbar-thumb:active {
	cursor: grabbing;
}

.scrollbar-track-y .scrollbar-thumb {
	width: 0.57em;
}

/* Forms */
#page-content .page-block-wrapper {
    border-radius: 5px;
    padding: 1.79em 3.57em;
    background: var(--secondary-background);
    position: relative;
    align-self: center;
    box-shadow: var(--block-shadow);
}

#page-content > .title {
    margin-bottom: calc(1.43em / 1.29);
    text-align: center;
    font-size: 1.29em;
    font-weight: bold;
}

#page-content .sub-title {
    margin-bottom: 1.43em;
}

.user-input-form {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.user-input-form .field-name label::after {
    content: ' *';
    color: transparent;
}

.user-input-form .field-name label.required::after {
    color: rgb(var(--status-red));
    font-weight: bold;
}

.user-input-form input:not([type='radio']):not([type='checkbox']),
.user-input-form textarea {
	background-color: var(--input-background);
	border: var(--secondary-border);
	border-radius: 5px;
}

select {
    background-color: var(--input-background);
	border: var(--secondary-border);
	border-radius: 5px;
	padding: 0 0.36em;
}

.user-input-form input:not([type='radio']):not([type='checkbox']),
.user-input-form select {
    width: 21.43em;
	height: 2.14em;
}

.user-input-form .input-wrapper {
	width: 14.29em;
	display: flex;
	flex-grow: 1;
}

.user-input-form div.input-wrapper input:not([type='radio']):not([type='checkbox']),
.user-input-form div.input-wrapper select {
    width: 100%;
    max-width: none;
    min-width: 0;
}

.user-input-form div.input-wrapper input:not([type='radio']):not([type='checkbox']):not(:last-child),
.user-input-form div.input-wrapper select:not(:last-child) {
    border-radius: 5px 0 0 5px;
}

.user-input-form .input-wrapper span.input-suffix {
    padding: 0 0.71em;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: var(--secondary-border);
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 0 5px 5px 0;
    border-left: none;
    display: flex;
    align-items: center;
}

.user-input-form .entity-table td,
.user-input-form .entity-table td > *,
.user-input-form .entity-table th > a > * {
    max-width: revert;
    overflow: revert;
}

.user-input-form .entity-table input:not([type='radio']):not([type='checkbox']),
.user-input-form .entity-table select {
    width: auto;
    max-width: 14.29em;
}

.user-input-form input {
	padding: 0 1.07em;
}

.user-input-form input {
	padding: 0 0.36em;
}

.user-input-form textarea {
	width: 100%;
	padding: 0.36em;
}

.dropdown-container {
    position: relative;
    display: inline-block;
    white-space: nowrap;
    background: var(--primary-background);
    border-radius: 25px;
    box-shadow: var(--block-shadow);
}

.dropdown-container.choice-wrapper {
    padding: 0.71em 1.07em;
}

form.alerts-conditions .choice-wrapper {
    margin-bottom: 1.07em;
}

.status-wrapper {
    padding: 0.71em;
    background: var(--input-background);
}

/*.dropdown-container:hover {
    border-radius: 25px 25px 0 0;
    z-index: 2;
}*/

tr.ui-sortable-helper .dropdown-container {
    pointer-events: none;
}

.dropdown-container .dropdown-content {
    display: none;
    visibility: hidden;
    position: absolute;
    left: 0;
    padding: 0.36em 0;
    background: var(--primary-background);
    border-radius: 0 0 25px 25px;
    z-index: -1;
    box-shadow: var(--block-shadow);
}

.dropdown-container.status-wrapper .dropdown-content {
    background: var(--input-background);
}

.dropdown-container.choice-wrapper label {
    display: flex;
    align-items: center;
    transition: var(--hover-transition);
}

.dropdown-container.status-wrapper label {
    display: flex;
}

.dropdown-container .dropdown-content label {
    padding-top: 0.36em;
    padding-bottom: 0.36em;
}

.dropdown-container.choice-wrapper .dropdown-content label {
    padding-left: 1.07em;
    padding-right: 1.07em;
    cursor: pointer;
}

.dropdown-container.choice-wrapper .dropdown-content label:hover {
    color: var(--hover-link);
}

.dropdown-container.status-wrapper .dropdown-content label {
    padding-left: 0.71em;
    padding-right: 0.71em;
}

.dropdown-container label i {
    font-size: 1.71em;
    margin-right: 0.36em;
}

.dropdown-container label input {
    display: none;
}

.fields-block-wrapper {
    background-color: var(--primary-background);
    padding: 0.71em 1.07em;
    border-radius: 5px;
    border: 2px solid var(--secondary-border-color);
}

.user-input-form table {
	border-collapse: collapse;
}

.user-input-form table:not(.parameters-table) tbody tr td,
.user-input-form table tbody tr.category-name td {
	padding-top: 0.71em;
	padding-bottom: 0.71em;
}

.user-input-form table tbody tr td.fields-subgroup {
    padding-bottom: 0.36em;
    text-align: center;
}
.user-input-form table tbody tr td.fields-subgroup i {
    vertical-align: middle;
    cursor: help;
}

.user-input-form table tbody tr.forgotten-password {
    height: auto;
}
.user-input-form table tbody tr.forgotten-password a {
    display: flex;
    justify-content: flex-end;
}

.user-input-form table tbody tr.category-name .flex-wrapper {
    justify-content: center;
    gap: 0.71em;
    font-weight: bold;
}

.user-input-form table:not(.entity-table) .field-name {
	text-align: right;
	padding-right: 0.36em;
	white-space: nowrap;
}

.user-input-form .entity-table .field-name {
	text-align: left;
}

.field-name-wrapper,
.input-title {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 0.36em;
}

.input-title {
    padding: 1.07em 0 0.36em 0;
}

.input-title:first-child {
    padding-top: 0;
}

.user-input-form .field-value {
	position: relative;
}

.user-input-form .field-value > * {
	vertical-align: middle;
}

.help-text {
    color: var(--secondary-font);
    font-size: 0.95em;
    margin-top: calc(0.36em/0.95);
}

.user-input-form .multiple-checkbox-filters {
    display: flex;
    gap: 0.71em;
    flex-wrap: nowrap;
    width: 100%;
}
.user-input-form .multiple-checkbox-filters .filter {
    display: flex;
    align-items: center;
    width: 100%;
}
.user-input-form .multiple-checkbox-filters .filter .filter-label {
    padding: 0 0.71em;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: var(--secondary-border);
    white-space: nowrap;
    vertical-align: middle;
    border-radius: 5px 0 0 5px;
    border-left: none;
    display: flex;
    align-items: center;
    height: 100%;
}
.user-input-form .multiple-checkbox-filters .filter:first-child .filter-label {
    border-bottom-left-radius: 0;
}
.user-input-form .multiple-checkbox-filters .filter .filter-input-wrapper {
    width: 100%;
}
.user-input-form .multiple-checkbox-filters .filter .filter-input {
    width: 100%;
    border-radius: 0 5px 5px 0;
}
.user-input-form .multiple-checkbox-filters .filter:last-child .filter-input {
    border-bottom-right-radius: 0;
}

.user-input-form .multiple-checkbox-wrapper {
    width: 100%;
    background-color: var(--primary-background);
    border-radius: 0 0 5px 5px;
}
.user-input-form .multiple-checkbox {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: min-content;
    height: 13.1em;
}
.user-input-form .multiple-checkbox .choice {
    padding: 0.36em;
    margin: 0.36em;
    border: 1px solid;
    border-radius: 5px;
    cursor: pointer;
    transition: var(--hover-transition);
}
.user-input-form .multiple-checkbox .choice.selected {
    border-color: rgb(var(--status-green));
}
.user-input-form .multiple-checkbox .choice.selected:hover {
    border-color: rgb(var(--second-green));
    background-color: rgb(var(--status-green), 0.4);
}
.user-input-form .multiple-checkbox .choice:not(.selected) {
    border-color: rgb(var(--status-red));
}
.user-input-form .multiple-checkbox .choice:not(.selected):hover {
    border-color: rgb(var(--second-red));
    background-color: rgb(var(--status-red), 0.4);
}
.user-input-form .multiple-checkbox .choice .choice-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.user-input-form .multiple-checkbox .choice .choice-label {
    margin-top: 0.21em;
    overflow: hidden;
}
.user-input-form .multiple-checkbox .choice .choice-input {
    display: none;
}

.main-buttons-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    position: relative;
    margin-top: 1.43em;
    gap: 2.14em;
}

.entity-detail-modal .main-buttons-wrapper {
    margin-top: 0;
    margin-bottom: 1.43em;
}

.main-button {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: calc(11.43em / 1.21);
    flex: 1 0 0;
    padding: 0 0.36em;
    color: white;
    border-radius: 5px;
    height: calc(2.14em / 1.21);
    font-size: 1.21em;
    gap: calc(0.36em / 1.21);
}

.main-button.large {
    max-width: calc(15em / 1.21);
}

.main-button i {
	font-size: calc(1.43em / 1.21);
}

.user-input-form .errorlist {
	text-align: center;
}

.user-input-form .errorlist li,
.field-error {
    color: rgb(var(--status-red));
    text-shadow: 0 0 0.71em rgb(var(--status-red)), 0 0 1.43em rgb(var(--second-red));
}

.user-input-form .field-errors-wrapper {
    margin-bottom: 0.36em;
}

.user-input-form table tbody tr.error-row td {
    text-align: center;
    padding-top: 0;
    padding-bottom: 0;
}

.user-input-form table tbody tr.error-row td div {
    padding-bottom: 0.71em;
}

.user-input-form .confirm-prompt {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
}

.user-input-form .confirm-prompt .complex-content-link {
    padding: 0 0.36em;
    font-weight: bold;
}

/* Theme dialog */
#theme-dialog .choices-list {
	display: flex;
	justify-content: space-evenly;
	padding: 0.71em 1.07em 1.07em 1.07em;
	border-radius: 5px;
	width: 100%;
}

#theme-dialog .theme-button-wrapper {
	text-align: center;
	font-size: 1.14em;
	cursor: pointer;
	margin: 0 1.07em;
    width: min-content;
}

#theme-dialog .choices-list:not(.theme-list) .theme-button-wrapper {
    flex-grow: 1;
}

#theme-dialog .theme-list .theme-button-wrapper {
    width: 7.14em;
}

#theme-dialog .theme-list .theme-button-wrapper,
#theme-dialog .choices-list .theme-button-wrapper img {
    border: 1px solid transparent;
    border-radius: 5px;
	transition: transform .2s ease-in-out;
}

#theme-dialog .choices-list .theme-button-wrapper img {
    height: 3.57em;
}

#theme-dialog .theme-list .theme-button {
	border-radius: 5px;
	padding: 0.36em 0;
	filter: inherit;
}

#theme-dialog .theme-button-wrapper[data-theme="Dark"] {
	color: rgba(225,235,245,.95);
}

#theme-dialog .theme-button-wrapper[data-theme="Dark"] .theme-button {
	background: #192231;
}

#theme-dialog .theme-button-wrapper[data-theme="Light"] {
	color: rgb(73, 80, 87);
}

#theme-dialog .theme-button-wrapper[data-theme="Light"] .theme-button {
	background: white;
}

#theme-dialog .theme-list .theme-button-wrapper:hover,
#theme-dialog .theme-list .theme-button-wrapper.active {
    transform: scale(1.1);
}

#theme-dialog .choices-list:not(.theme-list) .theme-button-wrapper:hover img,
#theme-dialog .choices-list:not(.theme-list) .theme-button-wrapper.active img {
	transform: rotate(0.0001deg) scale(1.1);
}

#theme-dialog .theme-list .theme-button-wrapper.active,
#theme-dialog .choices-list .theme-button-wrapper.active img {
	border: 2px dashed;
}

/* jQuery UI Dialog override */
.jquery-modal.blocker {
    z-index: 1100;
    background-color: rgba(170,170,170,0.6);
    padding: 2.86em 1.43em;
}

.dialog-modal-wrapper {
    display: none;
    background-color: var(--primary-background);
    border-radius: 3px;
    padding: 0.21em;
}

.jquery-modal .dialog-modal-wrapper {
    z-index: 1200;
    width: min-content;
    min-width: 35.71em;
    max-width: 100%;
}

.dialog-modal-wrapper .dialog-content-wrapper {
    margin: 0 0.5em 1.79em 0.5em;
    padding: 1px 1.29em 0 1.29em;
}

.dialog-modal-wrapper .modal-content {
    line-height: 1.4;
    background: var(--secondary-background);
    position: relative;
    border-radius: 5px;
    padding: 1.07em;
    display: inline-block;
    min-width: 100%;
    margin-top: 0.89em;
    overflow: hidden;
}

.jquery-modal .dialog-modal-wrapper .modal-body {
    height: 100%;
}

.dialog-modal-wrapper .dialog-titlebar {
    display: flex;
    align-items: center;
	background-color: var(--secondary-background);
	border: var(--secondary-border);
	color: var(--primary-font);
	border-radius: 3px;
	padding: .4em 3em .4em 1em;
	font-size: 1.07em;
	font-weight: bold;
	position: relative;
	margin-bottom: 0.89em;
}

.dialog-modal-wrapper .dialog-titlebar .title-wrapper {
    display: flex;
	align-items: center;
	gap: 0.36em;
    white-space: nowrap;
    overflow: hidden;
    margin-right: 0.36em;
}

.dialog-modal-wrapper .dialog-titlebar .dialog-title {
    max-width: none;
}

.dialog-modal-wrapper .dialog-titlebar .entity-status {
    font-size: calc(1em / 1.07);
}

.dialog-modal-wrapper .dialog-titlebar .dialog-return {
	position: absolute;
    left: calc(1em / 1.71);
    top: 50%;
    transform: translateY(-50%);
    font-size: 1em;
    height: calc(2em / 1.21);
}

.dialog-modal-wrapper .dialog-titlebar .dialog-close {
	position: absolute;
    right: calc(1em / 1.71);
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.71em;
}

.dialog-modal-wrapper .dialog-subtitle {
    text-align: center;
    margin-bottom: 0.71em;
    font-size: 1.07em;
    color: var(--secondary-font);
}

.dialog-modal-wrapper .confirm-prompt {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
}

.dialog-modal-wrapper .modal-content .socket-console {
    background-color: var(--primary-background);
    padding: 0.36em;
}

.dialog-modal-wrapper .modal-content .console-scroll {
    min-height: 14em;
    max-height: 30em;
    width: 40em;
    padding-right: 0.93em;
}

.dialog-modal-wrapper .modal-content .socket-console .socket-message {
    font-family: monospace;
}

.dialog-modal-wrapper .modal-content .socket-console .socket-message .message-content {
    display: inline;
}

.dialog-modal-wrapper .modal-content .socket-console .socket-message .message-content.error {
    color: rgb(var(--status-red));
}

.dialog-modal-wrapper .modal-content .socket-console .socket-message .message-content.warning {
    color: rgb(var(--status-orange));
}

.dialog-modal-wrapper .modal-content .socket-console .socket-message .message-content.success {
    color: rgb(var(--status-green));
}

.dialog-modal-wrapper .modal-content .socket-console .console-prefix {
    display: inline;
    margin-right: 0.36em;
    vertical-align: middle;
}

.dialog-modal-wrapper .modal-content .socket-console .console-cursor {
    height: 1.11em;
    width: 0.57em;
    background: white;
    animation: 2000ms ease infinite alternate blink;
    display: inline-block;
    vertical-align: middle;
}

.toggle-wrapper {
	display: flex;
	align-items: center;
	gap: 0.36em;
	flex-wrap: nowrap;
}

.toggle-wrapper .toggle-label {
	white-space: nowrap;
}

input[type="checkbox"].fancy-toggle {
	font-size: 0.86em;
	-webkit-appearance: none;
	   -moz-appearance: none;
			appearance: none;
	width: 3.5em;
	height: 1.5em;
	border-radius: 3em;
	position: relative;
	outline: none;
	-webkit-transition: var(--hover-transition);
			transition: var(--hover-transition);
	background: rgb(var(--status-white));
	border: none;
}
  
input[type="checkbox"].fancy-toggle:checked {
	background: rgb(var(--status-blue));
}

input[type="checkbox"].fancy-toggle[data-type="restricted"]:checked {
	background: rgb(var(--status-red));
}

input[type="checkbox"].fancy-toggle[data-type="maintenance"]:checked {
	background: rgb(var(--status-grey));
}

input[type="checkbox"].fancy-toggle:not(:checked):not([disabled]):hover {
	background: var(--fade-blue);
}

input[type="checkbox"].fancy-toggle[data-type="restricted"]:not(:checked):not([disabled]):hover {
	background: var(--fade-red);
}

input[type="checkbox"].fancy-toggle[data-type="maintenance"]:not(:checked):not([disabled]):hover {
	background: var(--fade-grey);
}

input[type="checkbox"].fancy-toggle:checked:not([disabled]):hover {
	background: rgb(var(--second-blue));
}

input[type="checkbox"].fancy-toggle[data-type="restricted"]:checked:not([disabled]):hover {
	background: rgb(var(--second-red));
}

input[type="checkbox"].fancy-toggle.forbidden {
	cursor: help;
}
  
input[type="checkbox"].fancy-toggle:after {
	position: absolute;
	content: "";
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	background: #fff;
	-webkit-box-shadow: 0 0 .25em rgba(0,0,0,.8);
			box-shadow: 0 0 .25em rgba(0,0,0,.8);
	-webkit-transform: scale(.7);
			transform: scale(.7);
	left: 0;
	-webkit-transition: left .2s ease-in-out;
			transition: left .2s ease-in-out;
}
  
input[type="checkbox"].fancy-toggle:checked:after {
	left: calc(100% - 1.5em);
}

.multiple-toggle {
    position: relative;
    font-size: 0.86em;
    display: inline-flex;
    flex-wrap: nowrap;
}
.multiple-toggle-label {
    position: relative;
    width: 3.5em;
    line-height: 1.5em;
    user-select: none;
    -webkit-transition: var(--hover-transition);
			transition: var(--hover-transition);
}
.multiple-toggle-input {
    display: none;
}
.multiple-toggle-input:not(:checked) + .multiple-toggle-label {
    cursor: pointer;
}
.multiple-toggle-label-0 {
    background-color: var(--fade-white);
    border-top-left-radius: 3em;
    border-bottom-left-radius: 3em;
}
.multiple-toggle-input:checked + .multiple-toggle-label-0 ~ .multiple-toggle-selector {
    /* Largeur du label - largeur du cercle */
    left: calc((3.5em / 2) - (1.5em / 2));
}
.multiple-toggle-input:checked + .multiple-toggle-label-0,
.multiple-toggle-input:not(checked) + .multiple-toggle-label-0:hover {
    background-color: rgb(var(--status-white));
}
.multiple-toggle-label-1 {
    background-color: var(--fade-blue);
}
.multiple-toggle-input:checked + .multiple-toggle-label-1 ~ .multiple-toggle-selector {
    /* Largeur du label - largeur du cercle */
    left: calc(33% + (3.5em / 2) - (1.5em / 2));
}
.multiple-toggle-input:checked + .multiple-toggle-label-1,
.multiple-toggle-input:not(checked) + .multiple-toggle-label-1:hover {
    background-color: rgb(var(--status-blue));
}
.multiple-toggle-label-2 {
    background-color: var(--fade-grey);
    border-top-right-radius: 3em;
    border-bottom-right-radius: 3em;
}
.multiple-toggle-input:checked + .multiple-toggle-label-2 ~ .multiple-toggle-selector {
    /* Largeur du label - largeur du cercle */
    left: calc(66% + (3.5em / 2) - (1.5em / 2));
}
.multiple-toggle-input:checked + .multiple-toggle-label-2,
.multiple-toggle-input:not(checked) + .multiple-toggle-label-2:hover {
    background-color: rgb(var(--status-grey));
}
.multiple-toggle-selector {
    position: absolute;
	content: "";
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	background: #fff;
	pointer-events: none;
	-webkit-box-shadow: 0 0 .25em rgba(0,0,0,.8);
			box-shadow: 0 0 .25em rgba(0,0,0,.8);
	-webkit-transform: scale(.7);
			transform: scale(.7);
	-webkit-transition: left .2s ease-in-out;
			transition: left .2s ease-in-out;
}

.entity-status {
	width: 1.43em;
    height: 1.43em;
    border-radius: 50%;
    border: 1px solid transparent;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.entity-status[data-status='white'] {
	cursor: help;
}

.entity-status[data-status='1'] .status-content {
	color: black;
}

.entity-status div.status-content {
    font-weight: normal;
}

.entity-status i.status-content {
    font-size: calc(1.29em / 1.43);
}

.map-modal .modal-header .entity-status,
.jquery-modal .dialog-title .entity-status{
	margin-left: 0.36em;
}

.dialog-modal-wrapper .properties-list {
	height: 100%;
	display: flex;
    justify-content: space-evenly;
    gap: 1.07em;
}

.properties-list .category-wrapper {
    background-color: var(--primary-background);
    border-radius: 5px;
    padding: 1.07em 0.25em 1.07em 1.07em;
    box-shadow: var(--block-shadow);
    max-width: 28em;
}

.properties-list .category-wrapper .category-title {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(1.07em * 1.07);
    margin-bottom: 0.71em;
    padding-right: 0.82em;
    color: var(--secondary-font);
    white-space: nowrap;
}

.properties-list .category-wrapper .category-title i {
    margin-right: 0.36em;
}

.properties-list .category-wrapper table {
    max-height: 21em;
    padding: 1px 0.82em 1px 0;
}

.properties-list .entity-property {
	border-radius: 5px;
}

.properties-list .entity-property:last-child {
	margin-bottom: 0;
}

.properties-list .entity-property .toggle-wrapper,
.properties-list .entity-property .property-name {
	font-weight: bold;
}

.properties-list .entity-property > * {
	white-space: nowrap;
	padding-top: 0.36em;
	padding-bottom: 0.36em;
}

.properties-list .entity-property > *:first-child {
	padding-left: 0.36em;
}

.properties-list .entity-property > *:last-child {
    display: flex;
    align-items: center;
	padding-left: 0.36em;
	padding-right: 0.36em;
}

.properties-list .entity-property .property-value {
	padding-left: 0.71em;
}

.properties-list .entity-property i.history-link,
.properties-list .entity-property i.help-tooltip {
    margin-left: 0.36em;
    font-size: 1.29em;
}

.properties-list .maintenance-message .content,
.properties-list .intervention-date .content {
    position: relative;
    display: flex;
    flex-direction: column;
}

.properties-list .maintenance-message .content > *,
.properties-list .intervention-date .content > * {
    min-width: 24em;
}

.properties-list .maintenance-message .content > * {
    min-height: 7em;
}

.properties-list .maintenance-message .main-buttons-wrapper,
.properties-list .intervention-date .main-buttons-wrapper {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: auto;
    margin-bottom: 0;
}

.properties-list .maintenance-message .text-wrapper,
.properties-list .intervention-date .text-wrapper {
	padding: 0.5em;
    border-radius: 5px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.36em;
}

.properties-list .maintenance-message .text-wrapper {
	flex-direction: column;
    color: #555;
    background-color: #eee;
    box-shadow: rgb(var(--status-grey)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-grey)) -0.14em -0.14em 0.29em 0px inset;
}

.properties-list .intervention-date .text-wrapper {
    align-items: center;
    background: var(--secondary-background);
    border-radius: 5px;
}

.properties-list .maintenance-message .text-wrapper .text {
	flex-grow: 1;
	font-weight: bold;
}

.properties-list .intervention-date .text-wrapper .intervention-date-label {
	font-weight: bold;
}

.properties-list .maintenance-message .text-wrapper button,
.properties-list .intervention-date .text-wrapper button {
	flex-grow: 0;
	padding: 0.36em;
}

.properties-list .maintenance-message .text-wrapper button {
	align-self: flex-end;
}

.properties-list .intervention-date .intervention-date-row {
    display: flex;
    column-gap: 0.36em;
}

.properties-list .maintenance-message .user-input-form,
.properties-list .intervention-date .user-input-form {
	gap: 0.36em;
    margin-bottom: 0.36em;
}

.properties-list .intervention-date .user-input-form {
    background: var(--secondary-background);
    border-radius: 5px;
    padding: 0.71em;
}

.properties-list .maintenance-message .user-input-form textarea {
	flex-grow: 1;
}

.properties-list .maintenance-message .prompt {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(170,170,170,0.6);
    height: calc(100% - 0.36em);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.36em;
    padding: 0.36em;
    border-radius: 5px;
    z-index: 1;
}

.properties-list .maintenance-message .prompt .question {
    white-space: nowrap;
    color: black;
    font-weight: bold;
}

i.help-tooltip {
    cursor: help;
}

.tooltipster-content {
    white-space: pre-wrap;
}

.modal-content.entity-alerts-modal .block-title {
    padding: calc(1.79em / 1.07) 0 calc(0.36em / 1.07) 0;
    margin-bottom: calc(0.36em / 1.07);
	border-bottom: var(--secondary-border);
    text-align: center;
    font-weight: bold;
}

.modal-content.entity-alerts-modal .block-title:nth-child(2) {
	padding-top: 0;
}

.modal-content.entity-alerts-modal .entity-table .buttons-wrapper {
    margin-bottom: 0.36em;
}

.modal-content .entity-alerts-list .entity-alert:first-child {
	border-top: 0;
	padding-top: 0;
}

.table-wrapper {
    position: relative;
}

.entity-table {
	position: relative;
}

table.entity-table {
	text-align: center;
	border-collapse: collapse;
	margin: 0 auto;
}

.hardware_list #page-content .entity-table {
    width: 100%;
}

.entity-table thead,
.entity-table tbody,
.entity-table tfoot {
    background: var(--primary-background);
}

.entity-table tr {
	height: 2.43em;
}

.entity-table th,
.entity-table td {
	border: var(--secondary-border);
	padding: 0.36em 0.71em;
	white-space: nowrap;
	height: 1px;
}

.entity-table tfoot td {
	padding: 0 0.71em;
}

.entity-table tr th {
	padding-left: 1.07em;
	padding-right: 1.07em;
}

.entity-table tbody td {
    max-width: 14.29em;
	text-overflow: ellipsis;
    overflow: hidden;
}
.entity-table.alerts-recipients-table tbody td {
    max-width: none;
}

.entity-table.users-table tbody td {
    max-width: none;
}

.entity-table.thread-errors tbody td,
.entity-table tbody td.alert-message-cell {
    max-width: none;
    white-space: nowrap;
}

.entity-table tbody td.alert-message-cell {
    text-align: left;
}

.entity-table tr .entity-check {
    padding: 0;
}
@-moz-document url-prefix() {
   .entity-table tr .entity-check {
        height: 100%;
    }
}
.entity-table tr .entity-check label {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0 1.07em;
}
.entity-table tr .entity-check label:hover {
    cursor: pointer;
}
.entity-table tr .entity-check label input {
    height: 100%;
}

.entity-table td > *,
.entity-table th > * {
	vertical-align: middle;
	text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
}

.entity-table tr.columns-names th[data-field] {
	user-select: none;
	cursor: pointer;
	position: relative;
}

.entity-table tr.columns-names .sort-arrow {
    margin: 0px -0.64em 0 0.43em;
    font-size: 1em;
}

.entity-table tr.search-row th {
	padding: 0.36em 0.71em;
    position: relative;
}

.entity-table tr.search-row input,
.entity-table tr.search-row select {
	background-color: var(--input-background);
	border: var(--secondary-border);
	height: 1.43em;
	border-radius: 5px;
}

.entity-table .search-row input,
.entity-table .search-row select {
	padding: 0 0.29em;
}

.entity-table tr.search-row input {
	width: 100%;
	outline: none;
}

.entity-table tr.search-row input[value]:not([value=""]) {
	padding-right: 1.2em;
}

.entity-table tr.search-row .number-input-wrapper {
    display: flex;
    gap: 0.36em;
}

.entity-table tr.search-row .number-input-wrapper input {
    min-width: 2.6em;
}

.entity-table .column-input-wrapper {
    overflow: visible;
}

.chart-container .column-input-wrapper {
    margin: 0 0.57em;
}

.chart-container .column-input-wrapper .select-option {
    height: 1.43em;
}

.chart-controls {
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

/*
 CSS for the main interaction
*/
.flip-container input {
    display: none;
}

.flip-container .flip-element {
    position: relative;
    display: flex;
    line-height: 2em;
    /* don't allow highlighting the text inside the toggle */
    user-select: none;
    background: var(--primary-background);
    transition: background 0.1s ease-out;
    box-shadow: inset 0 0.14em 0.43em rgba(0, 0, 0, 0.3);
}

.flip-container .flip-element label {
    /* Even though we're using "flex" to display, we have to assign widths so that we know exactly where to position the slide */
    min-width: 6em;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    z-index: 2;
    cursor: pointer;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
    transition: var(--hover-transition);
    white-space: nowrap;
}

.flip-container .flip-element a {
    position: absolute;
    left: 50%;
    z-index: 1;
    height: 100%;
    width: 50%;
    transition: left 0.1s ease-out;
    box-shadow: 1px 0 0 rgba(0, 0, 0, 0.2),
                inset 0 1px 0 rgba(255, 255, 255, 0.15);
    background: rgb(var(--status-grey));
    border: 1px solid #939aa0;
}

.flip-container input:checked + label,
.flip-container input:disabled + label {
    color: white;
}

.flip-container input:disabled + label {
    cursor: default;
}

.flip-container.multicheck input:checked + label {
    background: rgb(var(--status-grey));
    border: 1px solid #939aa0;
    box-shadow: 1px 0 0 rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.flip-container input:disabled + label,
.flip-container input:disabled ~ a {
    opacity: 0.4;
}

.flip-container input:not(:checked) + label:hover {
    color: var(--hover-link);
}

/*
  Auto adjusting widths
*/
.flip-container label:nth-last-child(6),
.flip-container label:nth-last-child(6) ~ label,
.flip-container label:nth-last-child(6) ~ a {
    width: 33.3334%;
}

.flip-container label:nth-last-child(8),
.flip-container label:nth-last-child(8) ~ label,
.flip-container label:nth-last-child(8) ~ a {
    width: 25%;
}

.flip-container label:nth-last-child(10),
.flip-container label:nth-last-child(10) ~ label,
.flip-container label:nth-last-child(10) ~ a {
    width: 20%;
}

.flip-container label:nth-last-child(12),
.flip-container label:nth-last-child(12) ~ label,
.flip-container label:nth-last-child(12) ~ a {
    width: 16.6667%;
}

/*
 Slider
*/

/* all options, first selected */
.flip-container input:checked ~ a {
    left: 0;
    box-shadow: 1px 0 0 rgba(0, 0, 0, 0.2),
                inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
/* 2 options, 2nd selected */
.flip-container label:nth-last-child(4) ~ input:nth-child(3):checked ~ a {
    left: 50%;
}
/* 3 options, 2nd selected */
.flip-container label:nth-last-child(6) ~ input:nth-child(3):checked ~ a {
    left: 33.3334%;
}
/* 3 options, 3rd selected */
.flip-container label:nth-last-child(6) ~ input:nth-child(5):checked ~ a {
    left: 66.6667%;
}
/* 4 options, 2nd selected */
.flip-container label:nth-last-child(8) ~ input:nth-child(3):checked ~ a {
    left: 25%;
}
/* 4 options, 3rd selected */
.flip-container label:nth-last-child(8) ~ input:nth-child(5):checked ~ a {
    left: 50%;
}
/* 4 options, 4th selected */
.flip-container label:nth-last-child(8) ~ input:nth-child(7):checked ~ a {
    left: 75%;
}
/* 5 options, 2nd selected */
.flip-container label:nth-last-child(10) ~ input:nth-child(3):checked ~ a {
    left: 20%;
}
/* 5 options, 3rd selected */
.flip-container label:nth-last-child(10) ~ input:nth-child(5):checked ~ a {
    left: 40%;
}
/* 5 options, 4th selected */
.flip-container label:nth-last-child(10) ~ input:nth-child(7):checked ~ a {
    left: 60%;
}
/* 5 options, 5th selected */
.flip-container label:nth-last-child(10) ~ input:nth-child(9):checked ~ a {
    left: 80%;
}
/* 6 options, 2nd selected */
.flip-container label:nth-last-child(12) ~ input:nth-child(3):checked ~ a {
    left: 16.6667%;
}
/* 6 options, 3rd selected */
.flip-container label:nth-last-child(12) ~ input:nth-child(5):checked ~ a {
    left: 33.3334%;
}
/* 6 options, 4th selected */
.flip-container label:nth-last-child(12) ~ input:nth-child(7):checked ~ a {
    left: 50%;
}
/* 6 options, 5th selected */
.flip-container label:nth-last-child(12) ~ input:nth-child(9):checked ~ a {
    left: 66.6667%;
}
/* 6 options, 6th selected */
.flip-container label:nth-last-child(12) ~ input:nth-child(11):checked ~ a {
    left: 83.3334%;
}

/*
 Because a11y
*/
.flip-container input:focus ~ a {
    outline: 2px solid rgb(var(--status-grey));
}

.column-input-wrapper {
    position: relative;
}

.column-input-wrapper .select-option {
    height: 100%;
    color: var(--primary-font);
    background-color: var(--secondary-background);
    border: var(--secondary-border);
    overflow: hidden;
}

.column-input-wrapper.elements-select .select-option {
    display: flex;
    align-items: center;
    height: 2.14em;
}

.column-input-wrapper > .select-option {
    display: flex;
    align-items: center;
    border-radius: 5px;
}

.column-input-wrapper .hidden-options .select-option {
    cursor: pointer;
    transition: var(--hover-transition);
    font-weight: bold;
    user-select: none;
    text-overflow: ellipsis;
    text-align: left;
}

.column-input-wrapper .hidden-options .select-option:not(.button) {
    justify-content: space-between;
}

.column-input-wrapper .hidden-options .select-option.button {
    color: white;
    padding-left: 0.29em;
    padding-right: 0.29em;
}

.column-input-wrapper .hidden-options .select-option.button:hover {
    color: white;
}

.column-input-wrapper .hidden-options .select-option.button {
    gap: calc(0.36em / 1.21);
}

.column-input-wrapper .hidden-options .select-option.button.create {
    background: rgb(var(--status-green));
}

.column-input-wrapper .hidden-options .select-option.button.create:hover {
    background: rgb(var(--second-green));
}

.column-input-wrapper .hidden-options .select-option:last-child {
    border-radius: 0 0 5px 5px;
}

.column-input-wrapper .hidden-options .select-option .option-text-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    column-gap: 0.36em;
    padding-left: 0.29em;
    padding-right: 0.29em;
    overflow: hidden;
}

.column-input-wrapper .hidden-options .select-option .option-text-wrapper:hover {
    background-color: var(--input-background);
    color: black;
}

.column-input-wrapper .hidden-options .select-option .option-text-wrapper .option-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.column-input-wrapper .hidden-options .select-option .option-text-wrapper .option-badge {
    padding: 0.14em 0.36em;
    border-radius: 5px;
}

.column-input-wrapper .hidden-options .select-option .option-buttons {
    display: flex;
    gap: 0.29em;
    padding-right: 0.29em;
    padding-left: 0.29em;
}

.column-input-wrapper .hidden-options .select-option .option-buttons .button {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    border-radius: 5px;
    height: 1.79em;
    width: 1.79em;
}

.column-input-wrapper .hidden-options .select-option .option-buttons .button i {
    font-size: 1em;
}

.column-input-wrapper .select-option .icon-wrapper,
.column-input-wrapper .select-option .select-input {
    position: relative;
    height: 100%;
    border-right: var(--secondary-border);
    color: black;
}

.column-input-wrapper.date input {
    padding: 0 0 0 0.29em;
}

.column-input-wrapper.text input {
    padding: 0 0 0 0.29em;
}

.column-input-wrapper .select-option .icon-wrapper input,
.column-input-wrapper .select-option .select-input {
    background-color: var(--input-background);
    border: none;
    border-radius: 5px 0 0 5px;
    padding-right: 1.43em;
    height: 1.43em;
}

.column-input-wrapper .select-option .icon-wrapper input.single-date {
    border-radius: 5px;
}

.column-input-wrapper .select-option .select-input {
    padding-left: 0.29em;
    height: 100%;
    display: flex;
    align-items: center;
    min-width: 15em;
}

.column-input-wrapper .select-option .select-input .option-text {
    color: var(--placeholder-font);
}

.column-input-wrapper .select-option[data-element-id] .select-input .option-text {
    color: black;
}

.chart-container .column-input-wrapper .select-option .icon-wrapper input {
    height: 100%;
    width: 9.7em;
}

.column-input-wrapper i.calendar,
.column-input-wrapper i.delete {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: calc(100% - 2px);
    display: flex;
    align-items: center;
    font-size: 1em;
    padding: 0 0.29em;
    border-radius: 0 5px 5px 0;
}

.column-input-wrapper .icon-wrapper i.calendar {
    pointer-events: none;
}

.column-input-wrapper .select-option .icon-wrapper > i {
    border-radius: 0;
}

.column-input-wrapper > .select-option > i {
    padding: 0 0.21em;
    cursor: pointer;
    transition: var(--hover-transition);
}

.column-input-wrapper > .select-option > i:hover {
    color: var(--hover-link);
}

.column-input-wrapper .hidden-options {
    display: none;
    font-weight: normal;
    position: absolute;
    width: 100%;
}

.entity-table .footer {
	display: flex;
	align-items: center;
}

.entity-table .footer > *:not(.total) {
	user-select: none;
}

.entity-table .footer a {
    cursor: pointer;
    transition: var(--hover-transition);
}

.entity-table .footer a,
.entity-table .footer span {
	border-radius: 5px;
	padding: 0.07em 0.29em;
	margin: 0.2em;
}

.entity-table .footer span.active,
.entity-table .footer a:hover {
	background: var(--primary-font);
	color: var(--highlighted-font);
}

.entity-table .footer .total {
	margin-left: auto;
	font-size: 1.2em;
	font-weight: bold;
}

.entity-table .buttons-wrapper {
	display: flex;
	align-items: center;
	margin-bottom: 1.07em;
	color: var(--secondary-font);
	white-space: nowrap;
}

.entity-table .buttons-wrapper select,
.entity-table .buttons-wrapper input.caption-simple-input {
    height: 2.14em;
	margin: 0 1.07em 0 0.71em;
    background-color: var(--secondary-input-background);
    border: var(--secondary-border);
    border-radius: 5px;
}

.entity-table .buttons-wrapper input.caption-simple-input {
    width: 2.5em;
	padding: 0 0.21em;
    text-align: center;
}

.entity-table .buttons-wrapper .mass-control {
	display: flex;
	align-items: center;
	background: var(--primary-background);
	border-radius: 5px;
	border: var(--secondary-border);
	padding: 0.36em 0.71em;
	margin-left: 0.71em;
	color: var(--primary-font);
}

.entity-table .buttons-wrapper .mass-control[data-type="restricted"] {
    margin-right: 1.07em;
}

.entity-table .buttons-wrapper .mass-control .control {
	border-radius: 5px;
	padding: 0.14em 0.29em;
	margin-left: 0.36em;
}

.entity-table .buttons-wrapper .mass-control .control:not(.color-white) {
	color: white;
}

.entity-table .buttons-wrapper .main-button {
	margin-left: auto;
	padding: 0 0.71em;
}

.entity-table .table-buttons-wrapper {
	display: flex;
    flex-wrap: nowrap;
    gap: 0.71em;
    align-items: center;
}

.entity-table .table-loading {
    position: absolute;
    background: var(--primary-background);
}

form.alerts-conditions table tbody tr,
form.alerts-conditions table tfoot tr {
	height: 3.71em;
}

form.alerts-conditions table button.add-form {
    max-width: none;
	margin: 0 auto;
	padding: 0 1.07em;
}

table.draggable tbody .drag-handle {
	cursor: move;
}

.ui-sortable-helper {
    display: table;
}

.charts-groups-wrapper {
    margin-top: 1.43em;
    border: 1px solid var(--primary-font);
    border-radius: 5px;
    overflow: hidden;
}

.charts-groups-wrapper .tab-selector {
    margin-bottom: 0;
    border-radius: 0;
    border-bottom: 1px solid var(--primary-font);
}

.charts-groups-wrapper .tab-selector .tab:first-child,
.charts-groups-wrapper .tab-selector .tab:last-child {
    border-radius: 0;
}

.charts-groups-wrapper .chart-list-wrapper {
    margin: 0 1.43em 1.43em 1.43em;
}

.chart-list-wrapper[data-group]:not(.active) {
    display: none;
}

.chart-list-wrapper.modal-charts,
#alerts-stats-charts {
    display: grid;
    grid-template-columns: auto auto;
    column-gap: 1.43em;
}

.extra-container {
    display: inline-flex;
    flex-direction: column;
    justify-content: end;
    margin-top: 1.43em;
}

.dialog-modal-wrapper .extra-container {
    margin-top: 1.07em;
    width: 42.86em;
}

.chart-container {
    height: 21.43em;
    display: inline-block;
    /*background: url("/static/monitoring/images/sand.88e27782b31e.png");*/
    border: 1px solid var(--primary-font);
    border-radius: 5px;
    position: relative;
}

.dialog-modal-wrapper .chart-container {
    width: 100%;
}

.chart-list-wrapper .highcharts-title .chart-filter {
    font-size: 1.29em;
    display: flex;
    align-items: center;
    background: rgb(var(--status-blue));
    padding: 0.14em 0.36em;
    border-radius: 5px;
    overflow: hidden;
    margin-left: calc(0.57em / 1.29);
    color: white;
}

.chart-list-wrapper .highcharts-title .chart-filter .filter-label {
    font-weight: bold;
}

.chart-list-wrapper .highcharts-title .chart-filter .filter-value {
    margin-left: 0.36em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chart-list-wrapper .highcharts-title .chart-filter i {
    font-size: calc(1.43em / 1.29);
    margin-left: 0.36em;
}

.highcharts-container {
    font-family: inherit;
    font-size: inherit;
    background-color: var(--highcharts-background);
    top: 0 !important;
    left: 0 !important;
}
.highcharts-background {
    background: url("/static/monitoring/images/sand.88e27782b31e.png");
    display: var(--highcharts-image);
}
.highcharts-title {
    font-size: 1em;
    font-weight: normal;
    width: 100% !important;
    left: 0 !important;
    text-align: center;
    white-space: nowrap !important;
    display: flex !important;
    justify-content: space-between;
}
.highcharts-title .title-text,
.controls-container .title-text {
    font-size: 1.29em;
    color: var(--primary-font);
    flex-grow: 1;
    overflow: hidden;
}
.highcharts-title .title-text {
    margin-right: 0.57em;
}
.controls-container .title-text {
    padding: 0 0.57em;
    text-align: center;
}
.highcharts-title > .main-button,
.highcharts-title .chart-buttons-wrapper .main-button {
    font-size: 1em;
    gap: 0.36em;
    margin-right: 0.57em;
    margin-left: auto;
    flex: 0 1 0;
    height: auto;
    max-width: none;
}
.highcharts-title .chart-buttons-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}
.highcharts-title .custom-legend-open i {
    font-size: 1em;
    margin-right: 0;
}
.highcharts-container.small-buttons .highcharts-title .custom-legend-open .legend-suffix {
    display: none;
}
.highcharts-title .custom-legend-open,
.highcharts-container .custom-legend-wrapper .button {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    color: white;
    padding: 0 0.36em;
}
.highcharts-container .custom-legend-wrapper {
    display: none;
    position: absolute;
    top: calc(2.29em + 3px);
    right: 7px;
    background-color: var(--secondary-background);
    border-radius: 5px;
    padding: 0.57em;
    flex-direction: column;
    row-gap: 0.36em;
    width: 12em;
    cursor: move;
    opacity: 0.5;
    transition: opacity 0.2s ease-in;
}
.highcharts-container .custom-legend-wrapper:hover {
    opacity: 1;
}
.highcharts-container .custom-legend-wrapper .custom-legend-menu {
    display: flex;
    align-items: center;
    gap: 0.71em;
    flex-wrap: nowrap;
}
.highcharts-container .custom-legend-wrapper .custom-legend-menu input {
    background-color: var(--input-background);
    border: var(--secondary-border);
    height: 1.43em;
    border-radius: 5px;
    display: block;
    width: 100%;
    padding: 0 0.29em;
}
.highcharts-container .custom-legend-wrapper .custom-legend-list {
    max-height: 13em;
}
.highcharts-container .custom-legend-wrapper .custom-legend-list .scroll-content {
    display: flex;
    flex-direction: column;
    align-items: start;
    row-gap: 0.36em;
}
.highcharts-container .custom-legend-wrapper .item {
    display: flex;
    flex-wrap: nowrap;
    column-gap: 0.36em;
    cursor: pointer;
    transition: opacity 0.2s ease-in;
}
.highcharts-container .custom-legend-wrapper .item.hidden {
    opacity: 0.3;
}
.highcharts-container .custom-legend-wrapper .item.hidden:hover {
    opacity: 0.5;
}
.highcharts-container .custom-legend-wrapper .item .symbol {
    width: 1em;
    height: 1em;
    border-radius: 50%;
    flex-shrink: 0;
}
.highcharts-container .custom-legend-wrapper .item.hidden .symbol {
    background-color: rgb(var(--status-grey)) !important;
}
.highcharts-container .custom-legend-wrapper .item .serie-name {
    font-weight: bold;
    transition: var(--hover-transition);
}
.highcharts-container .custom-legend-wrapper .item:not(.hidden):hover .serie-name {
    color: var(--secondary-font);
}
.highcharts-container .custom-legend-wrapper .item.all-control {
    margin-left: 1.36em;
}

.highcharts-container .fullscreen-button {
    position: absolute;
    font-size: 1em;
    left: 0.57em;
    bottom: 0.57em;
    padding: 0.14em 0.28em;
    border-radius: 5px;
    display: flex;
}
.highcharts-container .fullscreen-button i {
    font-size: 1em;
}

.highcharts-legend-item > text {
    fill: var(--primary-font);
    font-size: 1em;
}
.highcharts-legend-item > span {
    color: var(--primary-font);
    font-weight: bold;
    cursor: pointer;
}
.highcharts-legend-item:not(.hidden):not(.highcharts-legend-item-hidden):hover text {
    fill: var(--secondary-font) !important;
}
.highcharts-legend-item.hidden:hover text,
.highcharts-legend-item.highcharts-legend-item-hidden:hover text {
    fill: var(--hover-link) !important;
}
.highcharts-legend-item:hover span {
    color: var(--highcharts-legend-hover) !important;
}
.highcharts-legend-item-hidden * {
    fill: var(--secondary-font) !important;
    stroke: var(--secondary-font) !important;
    text-decoration: none;
}
.highcharts-legend-item-hidden > text,
.highcharts-legend-item.hidden > text {
    fill: var(--secondary-font) !important;
}
.highcharts-series .highcharts-point.hidden:not(.highcharts-point-hover) {
    opacity: 0.25 !important;
}
.highcharts-legend-item.highcharts-pie-series.hidden > path {
    opacity: 0.25 !important;
}
.highcharts-legend-item.highcharts-pie-series.hidden > span {
    color: var(--secondary-font);
}
.highcharts-legend-point-active .highcharts-point:not(.highcharts-point-hover) {
    opacity: 1 !important;
}
.highcharts-legend-item.mass-toggle path {
    display: none;
}
.highcharts-legend .highcharts-legend-item.mass-toggle > text {
    fill: var(--primary-font) !important;
}
.highcharts-legend .highcharts-legend-item.mass-toggle:hover > text {
    fill: var(--hover-link) !important;
}
.highcharts-legend-navigation {
    fill: var(--primary-font);
}
.highcharts-axis-line {
    stroke: var(--secondary-font);
}
.highcharts-axis-title {
    font-size: 0.9em;
    fill: var(--primary-font);
}
.highcharts-tick {
    stroke: var(--secondary-font);
}
.highcharts-axis-labels {
    fill: var(--secondary-font);
    font-size: 0.9em;
}
.highcharts-yaxis-labels {
    font-size: 0.79em;
}
.highcharts-crosshair-thin {
    stroke-dasharray: 2 2;
}
.highcharts-tooltip-container {
    z-index: 1100 !important;
}
.highcharts-tooltip text {
    font-size: 0.86em;
}
.highcharts-tooltip-point {
    font-size: 1.3em;
}
.highcharts-tooltip .highcharts-header {
    font-size: 1em;
}
.highcharts-yaxis-grid .highcharts-grid-line {
    display: none;
}
.highcharts-xaxis-grid .highcharts-minor-grid-line {
    stroke: var(--secondary-font);
    stroke-dasharray: 0.21em;
}
.highcharts-plot-line {
    stroke: var(--secondary-font);
    pointer-events: none;
}
.extra-container[data-type="column"] .highcharts-plot-line {
    stroke-width: 2px;
}
.highcharts-graph {
  stroke-width: 3px;
}
.highcharts-series.shortdot .highcharts-graph {
    stroke-dasharray: 0, 4;
}
.highcharts-data-label-connector {
    fill: none !important;
}
.gradient-colors-6.highcharts-color-0,
.gradient-colors-6 path.highcharts-color-0,
.gradient-colors-6 .highcharts-color-0 {
    fill: rgb(var(--status-green));
    stroke: rgb(var(--second-green));
}
.gradient-colors-6.highcharts-color-1,
.gradient-colors-6 path.highcharts-color-1,
.gradient-colors-6 .highcharts-color-1 {
    fill: #5cac63;
    stroke: #439351;
}
.gradient-colors-6.highcharts-color-2,
.gradient-colors-6 path.highcharts-color-2,
.gradient-colors-6 .highcharts-color-2 {
    fill: #8a8c56;
    stroke: #76783E;
}
.gradient-colors-6.highcharts-color-3,
.gradient-colors-6 path.highcharts-color-3,
.gradient-colors-6 .highcharts-color-3 {
    fill: #b86c49;
    stroke: #9E4F35;
}
.gradient-colors-6.highcharts-color-4,
.gradient-colors-6 path.highcharts-color-4,
.gradient-colors-6 .highcharts-color-4 {
    fill: rgb(var(--status-red));
    stroke: rgb(var(--second-red));
}
.gradient-colors-6.highcharts-color-5,
.gradient-colors-6 path.highcharts-color-5,
.gradient-colors-6 .highcharts-color-5 {
    fill: rgb(var(--status-grey));
    stroke: rgb(var(--second-grey));
}

.custom-colors.highcharts-color-0,
.custom-colors path.highcharts-color-0,
.custom-colors .highcharts-color-0,
.custom-colors.highcharts-color-10,
.custom-colors path.highcharts-color-10,
.custom-colors .highcharts-color-10 {
    fill: var(--highcharts-color-6);
    stroke: var(--highcharts-color-6);
}
.custom-colors.highcharts-color-1,
.custom-colors path.highcharts-color-1,
.custom-colors .highcharts-color-1 {
    fill: rgb(var(--status-green));
    stroke: rgb(var(--second-green));
}
.highcharts-graph.zone-1 {
    stroke: rgb(var(--second-green));
}
.custom-colors.highcharts-color-2,
.custom-colors path.highcharts-color-2,
.custom-colors .highcharts-color-2 {
    fill: rgb(var(--status-blue));
    stroke: rgb(var(--second-blue));
}
.custom-colors.highcharts-color-3,
.custom-colors path.highcharts-color-3,
.custom-colors .highcharts-color-3 {
    fill: rgb(var(--status-orange));
    stroke: rgb(var(--second-orange));
}
.custom-colors.highcharts-color-4,
.custom-colors path.highcharts-color-4,
.custom-colors .highcharts-color-4 {
    fill: rgb(var(--status-red));
    stroke: rgb(var(--second-red));
}
.highcharts-graph.zone-4 {
    stroke: rgb(var(--second-red));
}
.custom-colors.highcharts-color-5,
.custom-colors path.highcharts-color-5,
.custom-colors .highcharts-color-5 {
    fill: rgb(var(--status-purple));
    stroke: rgb(var(--second-purple));
}
.custom-colors.highcharts-color-6,
.custom-colors path.highcharts-color-6,
.custom-colors .highcharts-color-6 {
    fill: rgb(var(--status-grey));
    stroke: rgb(var(--second-grey));
}
.custom-colors.highcharts-color-7,
.custom-colors path.highcharts-color-7,
.custom-colors .highcharts-color-7 {
    fill: rgb(var(--status-black));
    stroke: rgb(var(--second-black));
}
.custom-colors.highcharts-color-8,
.custom-colors path.highcharts-color-8,
.custom-colors .highcharts-color-8 {
    fill: rgb(var(--status-yellow));
    stroke: rgb(var(--second-yellow));
}
.custom-colors.highcharts-color-9,
.custom-colors path.highcharts-color-9,
.custom-colors .highcharts-color-9 {
    fill: var(--highcharts-color-4);
    stroke: var(--highcharts-color-4);
}
.highcharts-colors.highcharts-color-0,
.highcharts-colors path.highcharts-color-0,
path.highcharts-colors.highcharts-color-0,
.highcharts-color-0 {
  fill: var(--highcharts-color-0);
  stroke: var(--highcharts-color-0);
}
.highcharts-colors.highcharts-color-1,
.highcharts-colors path.highcharts-color-1,
path.highcharts-colors.highcharts-color-1,
.highcharts-color-1 {
  fill: var(--highcharts-color-1);
  stroke: var(--highcharts-color-1);
}
.highcharts-colors.highcharts-color-2,
.highcharts-colors path.highcharts-color-2,
path.highcharts-colors.highcharts-color-2,
.highcharts-color-2 {
  fill: var(--highcharts-color-2);
  stroke: var(--highcharts-color-2);
}
.highcharts-colors.highcharts-color-3,
.highcharts-colors path.highcharts-color-3,
path.highcharts-colors.highcharts-color-3,
.highcharts-color-3 {
  fill: var(--highcharts-color-3);
  stroke: var(--highcharts-color-3);
}
.highcharts-colors.highcharts-color-4,
.highcharts-colors path.highcharts-color-4,
path.highcharts-colors.highcharts-color-4,
.highcharts-color-4 {
  fill: var(--highcharts-color-4);
  stroke: var(--highcharts-color-4);
}
.highcharts-colors.highcharts-color-5,
.highcharts-colors path.highcharts-color-5,
path.highcharts-colors.highcharts-color-5,
.highcharts-color-5 {
  fill: var(--highcharts-color-5);
  stroke: var(--highcharts-color-5);
}
.highcharts-colors.highcharts-color-6,
.highcharts-colors path.highcharts-color-6,
path.highcharts-colors.highcharts-color-6,
.highcharts-color-6 {
  fill: var(--highcharts-color-6);
  stroke: var(--highcharts-color-6);
}
.highcharts-colors.highcharts-color-7,
.highcharts-colors path.highcharts-color-7,
path.highcharts-colors.highcharts-color-7,
.highcharts-color-7 {
  fill: var(--highcharts-color-7);
  stroke: var(--highcharts-color-7);
}
.highcharts-colors.highcharts-color-8,
.highcharts-colors path.highcharts-color-8,
path.highcharts-colors.highcharts-color-8,
.highcharts-color-8 {
  fill: var(--highcharts-color-8);
  stroke: var(--highcharts-color-8);
}
.highcharts-colors.highcharts-color-9,
.highcharts-colors path.highcharts-color-9,
path.highcharts-colors.highcharts-color-9,
.highcharts-color-9 {
  fill: var(--highcharts-color-9);
  stroke: var(--highcharts-color-9);
}

.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-series-group {
    transform: translateY(-1.57em);
}
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-data-label text,
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-data-label text,
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-container:not(.distrib) .highcharts-axis-labels,
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-axis-labels {
    fill: var(--primary-font);
}
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-data-label text {
    fill: #FFF;
    font-size: 1em;
}
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-pie-series .highcharts-point {
    transition: opacity 0s;
}
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-pie-series .highcharts-point {
    cursor: pointer;
}
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-pie-series .highcharts-legend-item .highcharts-point {
    transition: opacity 0s;
}
.highcharts-column-series path.highcharts-point {
    cursor: pointer;
}
.highcharts-container.distrib .highcharts-column-series path.highcharts-point {
    cursor: default;
    stroke: none;
}
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-data-label,
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-data-label {
    pointer-events: none;
}
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-column-series .highcharts-data-label,
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-column-series .highcharts-data-label {
    font-size: 1.3em;
}
.chart-list-wrapper .extra-container[data-type="column"] .chart-container .highcharts-xaxis-labels > text,
.chart-list-wrapper .extra-container[data-type="pie"] .chart-container .highcharts-xaxis-labels > text {
    font-size: 1.2em;
}

.highcharts-axis-labels .timeline-day {
    font-weight: bold;
    fill: var(--primary-font);
}

.highcharts-container .highcharts-plot-line-label {
    font-size: inherit;
}

.chart-list-wrapper .extra-container[data-type="xrange"] .highcharts-series .highcharts-point {
    transition: fill-opacity 250ms;
}

.chart-list-wrapper .extra-container[data-type="xrange"] .highcharts-series .highcharts-point-hover {
    fill-opacity: 0.75;
    transition: fill-opacity 50ms;
}

.extra-container .controls-container {
    margin-bottom: 0.71em;
}

.extra-container .controls-container .controls-subgroup {
    display: flex;
    column-gap: 1.43em;
}

.extra-container .controls-container .main-button {
    position: relative;
}

.chart-controls .chart-tooltip-button {
    cursor: pointer;
    height: 2.01em;
    display: flex;
    align-items: center;
    background-color: rgb(var(--status-grey));
    padding: 0.29em;
    border-radius: 5px;
    color: var(--dark-theme-font);
}

.chart-controls .chart-tooltip-button .wrapper {
    overflow: hidden;
    transition: height 0.4s;
    height: 100%;
    display: flex;
    align-items: center;
}

.chart-controls .chart-tooltip-button[data-shared="0"] .wrapper {
    height: 0.43em;
}

.chart-controls .chart-tooltip-button:hover i {
    color: white;
}

.chart-controls .chart-tooltip-button i {
    transition: var(--hover-transition);
}

.extra-container .chart-custom-data {
    display: grid;
    column-gap: 1.43em;
    row-gap: 0.36em;
    justify-content: space-between;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    background-color: var(--highcharts-background);
    border-radius: 5px 5px 0 0;
    border: 1px solid var(--primary-font);
    border-bottom: none;
    padding: 0.57em;
    position: relative;
}

.extra-container .chart-custom-data ~ .chart-container {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.extra-container .chart-custom-data .loader-wrapper {
    position: absolute;
    height: 100%;
    width: 100%;
}

.extra-container .chart-custom-data .custom-data-entry {
    display: flex;
    padding: 0.21em 0.57em;
    border-radius: 5px;
    column-gap: 0.36em;
}

.extra-container .chart-custom-data .custom-data-entry .custom-data-name,
.extra-container .chart-custom-data .custom-data-entry .custom-data-value {
    font-size: 1.07em;
}

.dialog-modal-wrapper #alerts-stats-charts .chart-container {
    margin-top: 0;
}

.admin-buttons-wrapper > .main-button {
    margin: 0 auto calc(1.43em / 1.21) auto;
    width: calc(20em / 1.21);
}

.admin-buttons-wrapper .main-button {
    max-width: unset;
}

.admin-buttons-wrapper > .main-button:last-child {
    margin-bottom: 0;
}

.admin-buttons-wrapper > *:not(.main-button) {
    margin: 0 auto 1.43em auto;
    width: 20em;
    display: flex;
}

.admin-buttons-wrapper .file-upload-wrapper {
    flex-direction: row;
    column-gap: 1.07em;
}

.admin-buttons-wrapper .file-upload-wrapper input {
    display: none;
}

.admin-buttons-wrapper .file-upload-wrapper .file-name {
    flex: 1 0 0;
    color: black;
    background-color: var(--input-background);
    border: var(--secondary-border);
    border-radius: 5px;
    line-height: 2.14em;
    padding: 0 0.36em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}

.admin-buttons-wrapper .file-upload-wrapper .file-name.no-file {
    color: #7b7b7b;
}

.admin-buttons-wrapper .file-upload-wrapper .file-name:hover {
    opacity: 0.8;
}

.admin-buttons-wrapper .file-upload-wrapper button {
    flex: 0 1 0;
}

.admin-buttons-wrapper .files-visual-wrapper {
    column-gap: 1.07em;
    justify-content: space-around;
}

.admin-buttons-wrapper .files-visual-wrapper .file-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.admin-buttons-wrapper .files-visual-wrapper .file-visual .file-title {
    font-weight: bold;
    margin-bottom: 0.36em;
}

.admin-buttons-wrapper .files-visual-wrapper .file-visual .file-element {
    display: flex;
    column-gap: 0.71em;
}

.admin-buttons-wrapper .files-visual-wrapper .file-visual .file-element .file-icon {
    font-size: 4em;
}

.admin-buttons-wrapper .files-visual-wrapper .file-visual .file-element .file-buttons {
    display: flex;
    flex-direction: column;
    row-gap: 0.36em;
    align-items: center;
}

.collector-status-modal .threads-wrapper {
    display: flex;
    justify-content: space-evenly;
    gap: 2.14em;
}

.collector-status-modal .thread-element {
    background-color: var(--primary-background);
    border-radius: 5px;
    padding: 0.21em;
    margin-bottom: auto;
    box-shadow: var(--block-shadow);
    position: relative;
}

.collector-status-modal .thread-element .thread-title {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--secondary-background);
    border: var(--secondary-border);
    color: var(--primary-font);
    border-radius: 5px;
    padding: 0.4em 2em;
    font-weight: bold;
    white-space: nowrap;
}

.collector-status-modal .thread-element .thread-title i {
    margin-right: 0.36em;
}

.collector-status-modal .thread-element .thread-title .entity-status {
    margin-left: 0.36em;
    cursor: help;
}

.collector-status-modal .thread-element .thread-content {
    padding: 1.07em;
}

.collector-status-modal .thread-element .thread-property {
    display: flex;
    margin-top: 0.36em;
    white-space: nowrap;
    position: relative;
}

.collector-status-modal .thread-element .thread-property .name {
    margin-right: 0.36em;
    font-weight: bold;
}

.collector-status-modal .thread-element i.button {
    margin-left: 0.36em;
}

.collector-status-modal .thread-element .entity-table {
    margin: 1.07em;
}


tr[data-status='2'] {
    box-shadow: rgb(var(--status-blue)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-blue)) -0.14em -0.14em 0.29em 0px inset;
}
tr[data-status='5'] {
    box-shadow: rgb(var(--status-purple)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-purple)) -0.14em -0.14em 0.29em 0px inset;
}
tr[data-status='3'] {
    box-shadow: rgb(var(--status-orange)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-orange)) -0.14em -0.14em 0.29em 0px inset;
}
tr[data-status='4'] {
    box-shadow: rgb(var(--status-red)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-red)) -0.14em -0.14em 0.29em 0px inset;
}
tr[data-status='8'] {
    box-shadow: rgb(var(--status-yellow)) 0.14em 0.14em 0.29em 0px inset, rgb(var(--status-yellow)) -0.14em -0.14em 0.29em 0px inset;
}

.halo-container.color-2 {
    box-shadow: var(--highcharts-color-2) 0.14em 0.14em 0.29em 0px inset, var(--highcharts-color-2) -0.14em -0.14em 0.29em 0px inset;
}
.halo-container.color-5 {
    box-shadow: var(--highcharts-color-5) 0.14em 0.14em 0.29em 0px inset, var(--highcharts-color-5) -0.14em -0.14em 0.29em 0px inset;
}

/*.highcharts-colors.highcharts-color-0,
.highcharts-color-0 {
  fill: var(--highcharts-color-0);
  stroke: var(--highcharts-color-0);
}
.highcharts-colors.highcharts-color-1,
.highcharts-color-1 {
  fill: var(--highcharts-color-1);
  stroke: var(--highcharts-color-1);
}
.highcharts-colors.highcharts-color-2,
.highcharts-color-2 {
  fill: var(--highcharts-color-2);
  stroke: var(--highcharts-color-2);
}
.highcharts-colors.highcharts-color-3,
.highcharts-color-3 {
  fill: var(--highcharts-color-3);
  stroke: var(--highcharts-color-3);
}
.highcharts-colors.highcharts-color-4,
.highcharts-color-4 {
  fill: var(--highcharts-color-4);
  stroke: var(--highcharts-color-4);
}
.highcharts-colors.highcharts-color-5,
.highcharts-color-5 {
  fill: var(--highcharts-color-5);
  stroke: var(--highcharts-color-5);
}
.highcharts-colors.highcharts-color-6,
.highcharts-color-6 {
  fill: var(--highcharts-color-6);
  stroke: var(--highcharts-color-6);
}
.highcharts-colors.highcharts-color-7,
.highcharts-color-7 {
  fill: var(--highcharts-color-7);
  stroke: var(--highcharts-color-7);
}
.highcharts-colors.highcharts-color-8,
.highcharts-color-8 {
  fill: var(--highcharts-color-8);
  stroke: var(--highcharts-color-8);
}
.highcharts-colors.highcharts-color-9,
.highcharts-color-9 {
  fill: var(--highcharts-color-9);
  stroke: var(--highcharts-color-9);
}*/

body .daterangepicker {
    color: #212529;
    width: auto;
    font-size: inherit;
    margin-top: 0.5em;
}
body .daterangepicker .drp-calendar {
    max-width: 19.29em;
}
body .daterangepicker .drp-calendar.left {
    padding: 0.57em 0 0.57em 0.57em;
}
body .daterangepicker .drp-calendar.right {
    padding: 0.57em;
}
body .daterangepicker .calendar-table .next,
body .daterangepicker .calendar-table .prev {
    cursor: pointer;
}
body .daterangepicker .calendar-table .next span,
body .daterangepicker .calendar-table .prev span {
    padding: 0.21em;
}
body .daterangepicker .calendar-table th,
body .daterangepicker .calendar-table td {
    font-size: 0.86em;
    min-width: calc(2.29em / 0.86);
    width: calc(2.29em / 0.86);
    height: calc(1.71em / 0.86);
    line-height: calc(1.71em / 0.86);
    cursor: default;
}
body .daterangepicker .calendar-time {
    margin: 0.29em auto 0 auto;
    line-height: 2.14em;
}
body .daterangepicker select.hourselect,
body .daterangepicker select.minuteselect,
body .daterangepicker select.secondselect,
body .daterangepicker select.ampmselect {
    width: 3.57em;
    padding: 0.14em;
    font-size: 0.86em;
}
body .daterangepicker .drp-buttons {
    padding: 0.57em;
    line-height: 0.86em;
}
body .daterangepicker .drp-selected {
    font-size: 0.86em;
    padding-right: calc(0.57em / 0.86);
}
body .daterangepicker .drp-buttons .btn {
    margin-left: 0.57em;
    font-size: 0.86em;
    font-weight: bold;
    padding: 0.26em 0.57em;
}
body .daterangepicker:before {
    top: -0.5em;
    border-right: 0.5em solid transparent;
    border-left: 0.5em solid transparent;
    border-bottom: 0.5em solid #ccc;
}
body .daterangepicker.opensright:before {
    left: 0.64em;
}
body .daterangepicker:after {
    top: -0.43em;
    border-right: 0.43em solid transparent;
    border-bottom: 0.43em solid #fff;
    border-left: 0.43em solid transparent;
}
body .daterangepicker.opensright:after {
    left: 0.71em;
}

.info-wrapper {
    position: absolute;
    z-index: 401;
    top: 0.71em;
    display: flex;
    flex-wrap: nowrap;
}

.info-wrapper:first-child {
    left: 0.71em;
}

.info-wrapper:not(:first-child) {
    right: 0.71em;
}

.info-value {
    font-weight: bold;
	background: var(--primary-background);
	border-radius: 5px;
	border: var(--secondary-border);
	padding: 0.36em;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tab-selector {
	display: flex;
	border-bottom: var(--secondary-border);
	margin-bottom: 1.79em;
	border-radius: 5px 5px 0 0;
}

.tab-selector .tab {
	width: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
	white-space: nowrap;
	padding: 0.71em 1.43em;
	font-size: 1.14em;
	transition: var(--hover-transition);
}

.tab-selector .tab:not(.active) {
	cursor: pointer;
}

.tab-selector .tab:hover,
.tab-selector .tab.active {
	background: var(--primary-font);
	color: var(--highlighted-font);
}

.tab-selector .tab:first-child {
	border-top-left-radius: 5px;
}

.tab-selector .tab:last-child {
	border-top-right-radius: 5px;
}

.tab-selector .tab > i {
	margin-right: 0.36em;
	vertical-align: bottom;
}

.total-alerts-count {
    background: rgb(var(--status-red));
    color: white;
    font-weight: bold;
    border-radius: 5px;
    padding: 0.36em;
    white-space: nowrap;
}

.tab-selector .tab .total-alerts-count {
    margin-left: 0.36em;
    transition: var(--hover-transition);
}

.dialog-modal-wrapper .modal-content.all-alerts-modal {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

.dialog-modal-wrapper .modal-content.all-alerts-modal .table-wrapper {
    padding: 0 1.07em 0 1.07em;
}

.dialog-modal-wrapper .main-button.clear-alerts {
    max-width: none;
    flex: none;
}

.counter {
    top: 0.71em;
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    line-height: 1;
}

.counter .digits {
    display: flex;
}

.counter .digit-wrapper,
.counter-slash {
    height: 4.8em;
}

.counter .digit-wrapper {
    display: inline-block;
    background: white;
    border-radius: 4px;
    width: 3.1em;
    position: relative;
    box-shadow: 0.1em 0.1em 0.1em rgb(0 0 0 / 20%);
}

.counter .digit-wrapper::before {
    content: '';
    display: block;
    height: 50%;
    background: #ebebeb;
    border-radius: 4px 4px 0 0;
}

.counter[data-info="total"] .digit-wrapper {
    color: black;
}

.counter[data-info="total"] .digit-wrapper:not(:first-child) {
    margin-left: 0.29em;
}

.counter[data-info="future"] .digit-wrapper {
    color: rgb(var(--status-grey));
}

.counter[data-info="future"] .digit-wrapper:not(:first-child) {
    margin-left: 0.29em;
}

.counter[data-info="problems"] .digit-wrapper {
    color: rgb(var(--second-red));
}

.counter[data-info="problems"] .digit-wrapper:not(:last-child) {
    margin-right: 0.29em;
}

.counter .counter-digit {
    font-weight: bold;
}

.counter .counter-digit,
.counter-slash .slash-text {
    font-size: 3.5em;
    font-family: Helvetica Neue, Arial, serif;
}

.counter .counter-digit {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.counter-slash {
    line-height: 4.8em;
    padding: 0 0.36em;
}

.counter .info-label {
    margin-top: 0.21em;
    font-size: 1.3em;
    color: var(--counter-font);
}

.availability-wrapper .multiple-checkbox-wrapper .choice {
    width: 10.29em;
}

.availability-wrapper .column-input-wrapper {
    width: min-content;
    margin: 1.07em auto;
    z-index: 1;
}

.availability-wrapper .column-input-wrapper .select-option .icon-wrapper input {
    width: 19em;
}

.availability-wrapper .values-wrapper {
    display: grid;
    column-gap: 1.43em;
    row-gap: 0.71em;
    justify-content: space-between;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    background-color: var(--highcharts-background);
    border-radius: 5px;
    padding: 0.71em;
    position: relative;
}

.availability-wrapper .values-wrapper .statistic-label,
.availability-wrapper .values-wrapper .statistic-value {
    font-size: 1.2em;
}

.availability-wrapper .values-wrapper .statistic-value {
    display: flex;
    align-items: center;
    column-gap: calc(0.36em / 1.2);
    flex-wrap: nowrap;
}

.availability-wrapper .values-wrapper .statistic-value div[data-statistic] {
    font-weight: bold;
}

#switch-site-mode {
    position: absolute;
    max-width: none;
    transform: translateX(-50%);
    left: 50%;
}

.multiselect,
.multiselect > .drop-container,
.multiselect > .title > .icon {
    border: 1px solid;
    border-color: #CCCCCC;
}
.multiselect,
.multidropdown {
    position: relative;
}
.multiselect {
    width: auto;
    border-radius: 4px;
    outline: none;
    color: #58585A;
    background-color: var(--input-background);
    background-image: none;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.5);
    transition: border-color .2s;
}
.multiselect.active,
.multidropdown.active {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.multiselect:hover {
    border-color: rgba(0,0,0,0.3);
}
.multiselect > .title,
.multidropdown > .title {
    cursor: pointer;
    user-select: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.36em;
}
.subnet-filter-table .multidropdown > .title {
    gap: calc(0.36em / 1.4);
}
.multiselect > .title {
    padding: 0.36em;
}
.multiselect > .title .text,
.multidropdown > .title .text {
    display: flex;
    align-items: center;
    margin-top: 0;
    white-space: nowrap;
}
.multiselect > .title .select-badge,
.multidropdown > .title .select-badge {
    margin-left: 0.36em;
    padding: 0.14em 0.36em;
    border-radius: 0.36em;
}
.multiselect > .title > .icon,
.multidropdown > .title > .icon {
    border-radius: 50%;
    font-weight: 700;
    transition: .2s;
    align-items: center;
    justify-content: center;
    display: flex;
    font-size: 1.14em;
    padding: calc(0.14em / 1.14);
}
.subnet-filter-table .multidropdown > .title > .icon {
    font-size: calc(1.14em / 1.4);
}
.multiselect > .title > .icon {
    background-color: #F6F6F6;
}
.multiselect > .drop-container,
.multidropdown > .drop-container {
    /*display: none;*/
    visibility: hidden;
    overflow: auto;
    max-height: 217px;
    min-width: calc(100% + 2px);
    position: absolute;
    top: 100%;
    z-index: 99;
}
.multiselect > .drop-container {
    background-color: var(--input-background);
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
.multidropdown > .drop-container {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.multiselect.active > .drop-container,
.multidropdown.active > .drop-container {
    /*display: block;*/
    visibility: visible;
}
.multiselect:not([data-direction="left"]) > .drop-container,
.multidropdown:not([data-direction="left"]) > .drop-container {
    left: -1px;
}
.multiselect[data-direction="left"] > .drop-container,
.multidropdown[data-direction="left"] > .drop-container {
    right: -1px;
}
.multiselect > .drop-container > .multi-option,
.multidropdown > .drop-container > .multi-option {
    display: flex;
    padding: 5px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    align-items: center;
    user-select: none;
    white-space: nowrap;
}
.multiselect > .drop-container > .multi-option {
    cursor: pointer;
    transition: background-color .2s;
}
.multidropdown > .drop-container > .multi-option[data-status="1"] {
    background-color: rgb(var(--status-green));
}
.multidropdown > .drop-container > .multi-option[data-status="3"] {
    background-color: rgb(var(--status-orange));
}
.multidropdown > .drop-container > .multi-option[data-status="4"] {
    background-color: rgb(var(--status-red));
}
.multiselect > .drop-container > .multi-option.multi-option-all {
    justify-content: center;
}
.multiselect > .drop-container > .multi-option.disabled {
    box-shadow: none;
    opacity: .34;
    pointer-events: none;
}
.multiselect > .drop-container > .multi-option:hover {
    background-color: rgba(0,0,0,0.1);
}
.multiselect > .drop-container > .multi-option input {
    pointer-events: none;
    margin-right: 0.36em;
}
.multiselect .multi-overlay,
.multidropdown .multi-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    opacity: .4;
    z-index:100;
}
.multiselect .multi-overlay-wait,
.multidropdown .multi-overlay-wait {
    background-color: #CCC;
    cursor: wait;
}



@media (min-width: 2399.98px) {
	body {
        font-size: 17.5px;
    }
}

@media (min-width: 2879.98px) {
	body {
        font-size: 21px;
    }
}

@media (min-width: 3360.98px) {
	body {
        font-size: 24.5px;
    }
}

@media (min-width: 3799.98px) {
	body {
        font-size: 28px;
    }
}

@keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
}

@keyframes animateC {
    0% {
        transform:rotate(0deg);
    }
    100% {
        transform:rotate(360deg);
    }
}
@keyframes animate {
    0% {
        transform:rotate(45deg);
    }
    100% {
        transform:rotate(405deg);
    }
}

@keyframes blink {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0; }
}

@keyframes yellow-blink {
    0% { box-shadow: 0 0 0.75em rgb(var(--second-yellow)); }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0.75em rgb(var(--second-yellow)); }
}

@keyframes red-blink {
    0% { box-shadow: 0 0 0.75em rgb(var(--status-red)); }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0.75em rgb(var(--status-red)); }
}

@keyframes orange-blink {
    0% { box-shadow: 0 0 0.75em rgb(var(--status-orange)); }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0.75em rgb(var(--status-orange)); }
}

@keyframes purple-blink {
    0% { box-shadow: 0 0 0.75em rgb(var(--status-purple)); }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0.75em rgb(var(--status-purple)); }
}

@keyframes grey-blink {
    0% { box-shadow: 0 0 0.75em rgb(var(--status-grey)); }
    50% { box-shadow: none; }
    100% { box-shadow: 0 0 0.75em rgb(var(--status-grey)); }
}

@keyframes scale {
    30% { transform: scale(0.3); }
    100% { transform: scale(1); }
}
@keyframes ball-grid-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(0.5); opacity: 0.7; }
    100% { transform: scale(1); opacity: 1; }
}
@keyframes ball-pulse-rise-odd {
    0% { transform: scale(0.4); }
    25% { transform: translateY(2em); }
    50% { transform: scale(1.1); }
    75% { transform: translateY(-2em); }
    100% { transform: translateY(0) scale(0.75); }
}
@keyframes ball-pulse-rise-even {
    0% { transform: scale(1.1); }
    25% { transform: translateY(-2em); }
    50% { transform: scale(0.4); }
    75% { transform: translateY(2em); }
    100% { transform: translateY(0) scale(1); }
}
@keyframes ball-zig-deflect {
    17% { transform: translate(-1em, -2em); }
    34% { transform: translate(1em, -2em); }
    50% { transform: translate(0, 0); }
    67% { transform: translate(1em, -2em); }
    84% { transform: translate(-1em, -2em); }
    100% { transform: translate(0, 0); }
}
@keyframes ball-zag-deflect {
    17% { transform: translate(1em, 2em); }
    34% { transform: translate(-1em, 2em); }
    50% { transform: translate(0, 0); }
    67% { transform: translate(-1em, 2em); }
    84% { transform: translate(1em, 2em); }
    100% { transform: translate(0, 0); }
}
@keyframes ball-triangle-path-1 {
    33% { transform: translate(1.79em, -3.57em); }
    66% { transform: translate(3.57em, 0px); }
    100% { transform: translate(0px, 0px); }
}
@keyframes ball-triangle-path-2 {
    33% { transform: translate(1.79em, 3.57em); }
    66% { transform: translate(-1.79em, 3.57em); }
    100% { transform: translate(0px, 0px); }
}
@keyframes ball-triangle-path-3 {
    33% { transform: translate(-3.57em, 0); }
    66% { transform: translate(-1.79em, -3.57em); }
    100% { transform: translate(0px, 0px); }
}
@keyframes ball-spin-fade {
    50% { opacity: 0.3; transform: scale(0.4); }
    100% { opacity: 1; transform: scale(1); }
}
@keyframes rotate {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(0.6); }
    100% { transform: rotate(360deg) scale(1); }
}