body, html {
	overflow : hidden;
}

.ui-layout {
	position              : absolute;
	padding               : 0;
	margin                : 0;
	display               : grid;
	grid-template-columns : 250px auto;
	grid-template-rows    : 100vh;
	grid-gap              : 0;
	color                 : #222;
	overflow              : hidden;
	width                 : 100vw;
	transition         : all 100ms ease;
	-webkit-transition : all 100ms ease;
	-moz-transition    : all 100ms ease;
}
.ui-layout.short {
	grid-template-columns : 80px auto;
}
.ui-layout .lists {
	border-right          : 1px solid var(--gray-darkblue);
	display               : grid;
	grid-template-columns : 100%;
	grid-template-rows    : calc(60px + 1px) auto 40px;
	grid-gap              : 0;
}
.ui-layout .lists.two {
	grid-template-rows : calc(60px + 1px) auto;
	background         : var(--gray-lite);
}
.ui-layout .info {
	background : var(--white);
}
.ui-layout .topcontainer {
	color      : #222;
	background : var(--gray-lite);
	border     : 1px dotted var(--gray-lite);
}

.avatar {
	display    : block;
	padding    : 5px;
	text-align : center;
}
.avatar--image {
	display    : inline-block;
	width      : 100%;
	margin-top : 10px;
}
.avatar--txt {
	display        : inline-block;
	width          : 100%;
	box-sizing     : border-box;
	vertical-align : top;
}
.avatar--logo {
	width           : 100%;
	height          : 30px;
	border          : 0;
	background      : url("../images/logo-white.png") no-repeat center center;
	background-size : contain;
	display         : inline-block;
	box-sizing      : border-box;
}

.ui-center {
	display               : grid;
	grid-template-columns : 100%;
	grid-template-rows    : calc(60px + 1px) auto;
	grid-gap              : 0;
	background            : #FFF;
	/*box-shadow            : inset 5px 10px 10px 0 rgba(0, 0, 0, .4);*/
	transition            : left 500ms ease;
	-webkit-transition    : left 500ms ease;
	-moz-transition       : left 500ms ease;
}
.ui-center .header {
	height     : 60px;
	background : var(--green-dark);
	/*border-bottom : 1px dotted var(--gray3);*/
	box-shadow : 5px 0 10px 0 rgba(0, 0, 0, .6);
}
.ui-center .body {
	overflow-y : auto;
	position   : relative;
	overflow-x : hidden;
}
.ui-center .body .tabbody {
	padding : 10px 20px 10px 20px;
}

.ui-navigation {
	color                 : #FFF;
	background            : var(--gray-darkblue);
	padding               : 0;
	display               : grid;
	grid-template-columns : 250px;
	grid-template-rows    : 60px auto 40px;
	box-shadow            : 5px 0 10px 0 rgba(50, 50, 50, 0.5);
	z-index               : 10;
}
.ui-navigation .header,
.ui-navigation .footer {
	background     : rgba(0, 0, 0, 0.3);
	border-bottom  : 1px solid var(--gray-darkblue);
	vertical-align : center;
}
.ui-navigation .footer {
	height : 40px;
}
.ui-navigation .footer:hover {
	background : var(--black);
}
.ui-navigation .footer a {
	display        : block;
	font-size      : 1.2em;
	font-weight    : 700;
	color          : var(--gray3);
	padding        : 10px;
	text-transform : uppercase;
	border-top     : 1px dotted rgba(0, 0, 0, 0.5);
}
.ui-navigation .footer a .text {
	padding-left : 10px;
}

.ui-navigation .tabs {
	overflow-y      : auto;
	scrollbar-color : var(--green-dark) #37474F !important;
	/*box-shadow : 0 14px 10px -10px rgba(0, 0, 0, .3);*/
}
.ui-navigation .tabs::-webkit-scrollbar {
	width            : 5px;
	background-color : #263238;
	color            : #263238;
}
.ui-navigation .tabs::-webkit-scrollbar-thumb {
	height           : 50px;
	background-color : var(--green-dark);
	color            : #263238;
	border-radius    : 1px;
}
.ui-navigation .tabs::-webkit-scrollbar-track {
	-webkit-box-shadow : inset 0 0 6px rgba(0, 0, 0, 0.3);
	background-color   : #263238;
	color              : #263238;
}

.ui-navigation ul {
	list-style : none;
	margin     : 0;
	padding    : 0;
	border     : 0;
	width      : 100%;
}
.ui-navigation ul li.ytab {
	display     : block;
	margin      : 0;
	color       : #FFF;
	font-size   : 1.2em;
	font-weight : 700;
	border      : 0;
	position    : relative;
}
.ui-navigation ul li.ytab a.current,
.ui-navigation ul li.ytab a.current i{
	color      : var(--white) /*#7E57C2*/ !important;
	background : var(--green) /*#311B92*/;
}
.ui-navigation ul li.ytab > .text {
	color          : var(--gray3);
	vertical-align : text-bottom;
	padding-left   : 15px;
	line-height    : 1.4em;
}
.ui-navigation ul li.ytab.current > .text {
	color : var(--greens) /*#D500F9*/ !important;
}
.ui-navigation ul li.ytab a {
	color          : var(--gray3);
	padding        : 10px;
	display        : block;
	text-transform : uppercase;
	border-top     : 1px dotted rgba(0, 0, 0, 0.5);
}
.ui-navigation ul li.ytab a:first-child {
	border : 0;
}
.ui-navigation ul li.ytab a:hover,
.ui-navigation ul li.ytab a:hover i{
	background : rgba(0, 0, 0, 0.3);
}
.ui-navigation ul li.ytab a span {
	/*padding-left: 10px;*/
}
.ui-navigation ul li.ytab .icn {
	font-size : 1.1em;
	margin-right: 10px;
}
.ui-navigation ul li.ytab .arrow {
	position : relative;
	float    : right;
}
.ui-navigation ul li.ytab .arrow:before {
	position       : absolute;
	top            : 2px;
	right          : 5px;
	width          : 40px;
	line-height    : 1.4em;
	font-family    : fontello;
	content        : "\e858";
	text-align     : right;
	vertical-align : middle;
}


.ui-navigation ul.subtab {
	list-style  : none;
	margin      : 5px 0 0 0;
	padding     : 0;
	border      : 0;
	width       : 100%;
	font-weight : 400;
}
.ui-navigation ul.subtab li {
	display     : block;
	color       : var(--gray3);
	font-size   : 0.85em;
	line-height : 30px;
	border      : 0;
	box-sizing  : border-box;
	cursor      : pointer;
}
.ui-navigation ul.subtab li:hover {
	background : var(--greens);
}
.ui-navigation ul.subtab li.active {
	background  : var(--green-sublite);
	color       : #222;
	font-weight : 700;
}
.ui-navigation ul.subtab li span:first-child {
	display      : inline-block;
	width        : 40px;
	height       : 30px;
	text-align   : center;
	margin-right : 5px;
	margin-left  : 10px;
	padding-left : 10px;
	color        : var(--green);
}
.ui-navigation ul.subtab li.active span {
	/*background : var(--biruza);*/
	color : var(--black);
}
.ui-navigation ul.subtab li:hover span {
	/*background : var(--biruza);*/
	color : #222;
}
.ui-navigation ul.subtab li:hover {
	color      : #222;
	background : var(--green-sublite);
}
.ui-navigation ul.subtab li:hover i{
	color      : #222;
}
.ui-navigation ul.subtab li:last-child {
	margin-bottom : 10px;
}

.ui-navigation ul.subtab li.active i i.sub,
.ui-navigation ul.subtab li:hover i i.sub {
	color : var(--orange-dark) !important;
}
.ui-navigation ul.subtab li .count {
	position : absolute;
	right    : 10px;
	color    : var(--green);
	/*font-weight: bold;*/
}

/*Узкое навигационное меню*/
.ui-layout.collapsed {
	grid-template-columns : 60px auto;
}
.ui-layout.collapsed .avatar--image {
	width      : 40px;
	margin-top : 5px;
}
.ui-layout.collapsed .avatar--logo {
	width           : 40px;
	height          : 40px;
	background      : url("../images/logo-icon.png") no-repeat center center;
	/*background-size : 80%;*/
	background-size : contain;
	border          : 2px solid var(--gray-darkgray);
	border-radius   : 60px;
}
.ui-layout.collapsed .ui-navigation {
	grid-template-columns : 60px;
	z-index: 85;
}
.ui-layout.collapsed .ui-navigation .tabs {
	overflow : unset;
}
.ui-layout.collapsed .ui-navigation ul li.ytab .icn {
	margin-right: 0;
}
.ui-layout.collapsed .ui-navigation li.ytab {
	position   : relative;
	text-align : center;
}
.ui-layout.collapsed .ui-navigation li.ytab:hover {
	background : rgba(0, 0, 0, 0.3);
}
.ui-layout.collapsed .ui-navigation li.ytab > a > .text,
.ui-layout.collapsed .ui-navigation li.ytab > a > .arrow {
	display : none;
}
.ui-layout.collapsed .ui-navigation .footer > a > .text {
	display : none;
}
.ui-layout.collapsed .ui-navigation ul.subtab {
	position   : absolute;
	left       : 100%;
	top        : 0;
	z-index    : 50;
	width      : 250px;
	background : var(--black);
	color      : var(--green-sublite);
	text-align : left;
	display    : none;
	box-shadow : 0 4px 2px -3px rgba(50, 50, 50, 0.5);
	max-height : 60vh;
	overflow-y : auto;
}
.ui-layout.collapsed .ui-navigation ul.subtab li {
	font-size   : 0.85em;
	line-height : 40px;
}
.ui-layout.collapsed .ui-navigation .footer a {
	text-align : center;
}
.ui-layout.collapsed .ui-navigation > ul > li.ytab.current > .text {
	color : var(--gray-darkblue) !important;
}
.ui-layout.collapsed .ui-navigation ul.subtab li:hover {
	color       : var(--gray-darkblue);
	background  : var(--green-lite);
	font-weight : 400;
}
.ui-layout.collapsed .ui-navigation ul.subtab li.active {
	color       : var(--gray-darkblue);
	background  : var(--green-sublite);
	font-weight : 700;
}
.ui-layout.collapsed .ui-navigation ul li.ytab.current li:hover .text,
.ui-layout.collapsed .ui-navigation ul li.ytab.current li.active .text {
	color : var(--gray-darkblue) !important;
}
.ui-layout.collapsed .ui-navigation ul li.ytab:hover .subtab {
	display : block;
}
.ui-layout.collapsed .ui-navigation ul.subtab li:last-child {
	margin-bottom : 0;
}
.ui-layout.collapsed .ui-navigation ul.subtab li span:first-child {
	width        : 30px;
	margin-right : 5px;
	margin-left  : 5px;
	padding-left : 0;
}
.ui-layout.collapsed .bottom-block {
	left : 80px !important;
}
.ui-layout.collapsed .multi--buttons {
	left : 140px !important;
}
.ui-layout.collapsed .ui-navigation ul.subtab .subtitle {
	display     : block;
	background  : var(--gray-darkblue);
	color       : var(--gray3);
	line-height : 20px;
	padding     : 5px 20px;
	font-size   : 0.8rem;
	position    : -webkit-sticky;
	position    : sticky;
	top         : 0;
	z-index     : 10;
}

.ui-layout .ui-navigation ul.subtab .subtitle {
	display : none;
}

.lists .mainblock {
	overflow-y : auto;
	overflow-x : hidden;
	z-index    : 0;
}

ul li {
	user-select         : none;
	-moz-user-select    : none;
	-webkit-user-select : none;
}
ul li.disabled > a {
	color      : var(--gray-darkblue) !important;
	background : rgba(0, 0, 0, 0.1) !important;
}
ul li.disabled > a:hover {
	color      : var(--gray-darkblue) !important;
	background : rgba(0, 0, 0, 0.1) !important;
}
ul li > a sup {
	position  : absolute;
	top       : 10px;
	right     : auto;
	left      : 60%;
	font-size : 0.7em !important;
	color     : var(--white);
	padding   : 2px;
	width     : auto;
}
ul li > a sup:empty {
	visibility : hidden;
}

.inline:not(:first-child) {
	/*margin-left : -4px;*/
}
.infodiv .inline {
	/*border-width : 2px !important;
	border-style: solid !important;*/
}

.spaced {
	justify-content : space-between;
	display         : flex;
	box-sizing      : border-box;
	padding         : 0 20px 0 20px !important;
}

.ui-center .header {
	/*box-shadow: 0 2px 3px 0 rgba(0,0,0,.4);*/
	z-index : 11;
}
.ui-center .header .header {
	line-height : 60px;
	font-size   : 1.4em;
	text-align  : center;
	font-weight : 400;
	color       : #FFF;
}

.ui-center .header .razdel {
	display : inline-block;
	width   : 80%;
	height  : 60px;
}
.ui-center .header .toggle--menu {
	display       : inline-block;
	margin-left   : 10px;
	margin-top    : 5px;
	padding       : 0;
	color         : #FFF;
	font-size     : 1.05em;
	border        : 0;
	text-align    : center;
	position      : relative;
	width         : 50px;
	height        : 50px;
	line-height   : 50px;
	box-sizing    : border-box;
	border-radius : 50px;
	cursor        : pointer;
}
.ui-center .header .toggle--menu:hover {
	background : rgba(0, 0, 0, 0.3);
}
.ui-center .header .toggle--menu i {
	font-size : 1.0em;
}

.ui-center .top--filters{
	position: fixed;
	z-index: 12;
	top: 0;
	margin-left: 20px;
}
.ui-center .top--filters ul {
	list-style : none;
	margin     : 0;
	padding    : 0;
	border     : 0;
	width      : 100%;
}
.ui-center .top--filters ul li {
	display : inline-block;
}
.ui-center .top--filters ul li > a {
	display       : inline-block;
	margin-top    : 5px;
	padding       : 0;
	color         : #FFF;
	font-size     : 1.05em;
	border        : 0;
	text-align    : center;
	position      : relative;
	width         : 50px;
	height        : 50px;
	line-height   : 50px;
	box-sizing    : border-box;
	border-radius : 50px;
	cursor        : pointer;
}
.ui-center .top--filters ul li > a:hover {
	background : rgba(0, 0, 0, 0.3);
}

.ui-center .top--filters ul.wtext {
	margin-top  : 10px;
	margin-left : 10px;
}
.ui-center .top--filters ul.wtext li > a {
	width       : auto;
	height      : 40px;
	line-height : 25px;
	background  : rgba(0, 0, 0, 0.1);
	border      : 1px inset var(--green);
	padding     : 0 15px 0 0;
	margin      : auto;
}
.ui-center .top--filters ul.wtext li > a:hover {
	background : rgba(0, 0, 0, 0.3);
}
.ui-center .top--filters ul.wtext li .text {
	margin-left  : 5px;
	margin-right : 5px;
}
.ui-center .top--filters ul.wtext li > a .poprounder {
	display       : inline-block;
	margin        : 2px 0 0 2px;
	padding       : 0;
	border        : 1px solid var(--green);
	background    : rgba(0, 0, 0, 0.2);
	text-align    : center;
	width         : 34px;
	height        : 34px;
	line-height   : 30px;
	box-sizing    : border-box;
	border-radius : 50px;
}

.ui-center .top--filters .period {
	padding       : 0;
	color         : #FFF;
	background    : var(--green);
	margin-top    : 0;
	border-radius : 50px 0 0 50px;
	border        : 1px inset var(--green);
	height        : 37px;
	line-height   : 40px;
}
.ui-center .top--filters .period input {
	margin         : 0 0 2px;
	padding        : 4px 10px;
	width          : 120px;
	text-align     : center;
	font-weight    : bold;
	color          : #FFF;
	background     : var(--green);
	border         : 0;
	vertical-align : baseline;
}
.ui-center .top--filters .period input:focus {
	box-shadow         : 0 0 0 !important;
	-moz-box-shadow    : 0 0 0 !important;
	-webkit-box-shadow : 0 0 0 !important;
}

.ui-center .top--filters .buttonblock a.button,
.ui-center .top--filters .buttonblock a.button:link {
	padding            : 6px 20px;
	height             : 26px;
	line-height        : 26px;
	font-weight        : 700;
	border             : 1px inset var(--green) !important;
	border-radius      : 0 50px 50px 0;
	box-shadow         : 0 0 0 !important;
	-moz-box-shadow    : 0 0 0 !important;
	-webkit-box-shadow : 0 0 0 !important;
}
.ui-center .top--filters .buttonblock {
	border-radius  : 0 50px 50px 0;
	vertical-align : top;
}

.presets {
	background: var(--green);
	text-align: center;
	color: #FFF;
	cursor: pointer;
	border: 2px solid var(--green-dark);
	height: calc(1.5em + 22px);
	line-height: calc(1.5em + 22px);
	vertical-align: top;
	border-radius: 3px;
	margin-left: 5px;
}
.presets > a {
	padding     : 3px;
	display     : block;
	color       : #FFF;
	/*height      : 32px;*/
	/*line-height : 32px;*/
	width       : 40px;
}

.pagediv {
	display            : flex;
	position           : fixed;
	bottom             : 0;
	right              : 0;
	z-index            : 1;
	height             : 40px;
	line-height        : 40px;
	padding            : 0 20px;
	color              : var(--white);
	background         : var(--gray-darkblue);
	-webkit-box-sizing : border-box;
	-moz-box-sizing    : border-box;
	box-sizing         : border-box;
}
.pagediv {
	height : 40px;
}
.pagediv:hover {
	/*background : var(--black);*/
}
.pagediv a {
	display        : block;
	font-size      : 1.2em;
	font-weight    : 700;
	line-height    : 40px;
	color          : var(--white);
	/*padding        : 10px;*/
	text-transform : uppercase;
	border-top     : 1px dotted rgba(0, 0, 0, 0.5);
	width: 30px;
	text-align: center;
}
.pagediv a .text {
	padding-left : 10px;
}

.bottom-block {
	position : fixed;
	bottom   : 37px;
	left     : 270px;
	z-index  : 1;
}
.bottom-block a {
	display       : inline-block;
	width         : 4rem;
	height        : 4rem;
	line-height   : 4rem;
	font-size     : 1.5rem;
	color         : var(--white);
	background    : var(--green);
	border        : 1px solid var(--green-dark);
	border-radius : 50px;
	text-align    : center;
	box-shadow    : 0 0 5px var(--green);
	cursor: pointer;
}
.bottom-block a:hover{
	background    : var(--green-lite);
}
.bottom-block a:active{
	background    : var(--green-dark);
}

.bottom-block a.red {
	background : var(--red);
	color      : var(--white);
	border     : 1px solid var(--red-dark);
	box-shadow : 0 0 5px var(--red);
}
.bottom-block a.red:hover{
	background : var(--red-lite);
}
.bottom-block a.red:active{
	background : var(--red-dark);
}

.bottom-block a.blue {
	background : var(--blue);
	color      : var(--white);
	border     : 1px solid var(--blue-dark);
	box-shadow : 0 0 5px var(--blue);
}
.bottom-block a.blue:hover{
	background : var(--blue-lite);
}
.bottom-block a.blue:active{
	background : var(--blue-dark);
}

.bottom-block a.orange {
	background : var(--orange);
	color      : var(--white);
	border     : 1px solid var(--orange-dark);
	box-shadow : 0 0 5px var(--orange);
}
.bottom-block a.orange:hover{
	background : var(--orange-lite);
}
.bottom-block a.orange:active{
	background : var(--orange-dark);
}

.bottom-block a.violet {
	background : var(--violet);
	color      : var(--white);
	border     : 1px solid var(--violet-dark);
	box-shadow : 0 0 5px var(--violet);
}
.bottom-block a.violet:hover{
	background : var(--violet-lite);
}
.bottom-block a.violet:active{
	background : var(--violet-dark);
}

.bottom-block a.indigo {
	background : var(--indigo);
	color      : var(--white);
	border     : 1px solid var(--indigo);
	box-shadow : 0 0 5px var(--indigo);
}
.bottom-block a.indigo:hover{
	background : var(--indigo-lite);
}
.bottom-block a.indigo:active{
	background : var(--indigo-dark);
}

.bottom-block a.disabled{
	color: var(--black);
	background: var(--gray-sub) !important;
	border     : 1px solid var(--gray-dark);
	box-shadow : 0 0 5px var(--black);
	cursor: not-allowed;
	pointer-events: none;
	user-select         : none;
	-moz-user-select    : none;
	-webkit-user-select : none;
}

.topfxed-box{
	display  : block;
	position : fixed;
	top      : 0px;
	right    : 20px;
	height   : 60px;
	padding  : 5px 0;
	z-index  : 30;
	color: #FFF;
}

.username--button {
	/*position : absolute;
	top      : 5px;
	right    : 10px;*/
	display: inline-block;
}

.notify--button {
	/*position : absolute;
	top      : 5px;
	right    : 10px;*/
	display: inline-block;
	margin-right: 10px;
}
.notify--button .popblock > a {
	display       : inline-block;
	padding       : 0;
	font-size     : 1.05em;
	border        : 0;
	text-align    : center;
	width         : 50px;
	height        : 50px;
	line-height   : 50px;
	box-sizing    : border-box;
	border-radius : 50px;
	cursor        : pointer;
	color         : var(--white);
}
.notify--button .popblock > a:hover {
	background : rgba(0, 0, 0, 0.3);
}
.notify--button .popblock > a .bullet {
	position : absolute;
	right    : -10px;
	left     : unset;
	top      : -5px;
}
.notify--button .popblock .popblock-items {
	overflow-y : auto;
	max-height : 70vh;
}
.notify--button .popblock .items--head {
	padding       : 10px 0 10px 5px;
	z-index       : 10;
	border-radius : 5px 5px 0 0;
}

.notify {
	margin-top : 20px;
}
.notify i {
	z-index  : 0;
	position : initial;
}

.button.dashed {
	background         : #FFF !important;
	border             : 1px dashed var(--green) !important;
	color              : #222 !important;
	padding            : 10px 20px !important;
	box-shadow         : 0 0 0 0 rgba(0, 0, 0, 0) !important;
	-webkit-box-shadow : 0 0 0 0 rgba(0, 0, 0, 0) !important;
	-moz-box-shadow    : 0 0 0 0 rgba(0, 0, 0, 0) !important;
}
.button.dashed:hover {
	background : var(--orange) !important;
}

.sticky-wrapper .ui-navigation {
	box-shadow : 0 14px 10px -10px rgba(0, 0, 0, .3);
}
.sticky-wrapper.is-sticky .ui-navigation .text {
	display : none;
}
.sticky-wrapper.is-sticky #dtabs ul li sup {
	right : -5px;
}

.userlist {
	margin-top            : 20px;
	display               : grid;
	grid-template-columns : repeat(auto-fill, calc(25% - 10px));
	grid-gap              : 10px 10px;
}
.userlist > div {
	font-size     : 1.0em;
	padding       : 10px;
	border-radius : 3px;
	border        : 0;
	box-sizing    : border-box;
}
.userlist > div:hover {
	background : var(--gray);
	box-shadow : 0 2px 3px 0 rgba(0, 0, 0, .4);
}
.userlist > div.active {
	border: 1px dashed var(--green);
	border-left      : 4px solid var(--green);
	background-color : var(--green-sublite);
}
.userlist > div.disabled {
	border: 1px dashed var(--gray3);
	border-left : 4px solid var(--gray3);
	background  : #EEE;
}

.typelist {
	display               : grid;
	grid-template-columns : minmax(100px, 200px) auto 120px 80px 120px;
	grid-gap              : 10px 10px;
}
.typelist.fourcol {
	display               : grid;
	grid-template-columns : 100px auto 120px 80px;
	grid-gap              : 10px 10px;
}
.typelist.fourcols {
	display               : grid;
	grid-template-columns : 250px auto 80px 120px;
	grid-gap              : 10px 10px;
}
.typelist > div {
	padding : 10px;
}
.typelist.address {
	display               : grid;
	grid-template-columns : minmax(80px, 120px) auto 120px 160px 160px 80px 120px;
	grid-gap              : 10px 10px;
}
.typelist.vacancy {
	display               : grid;
	grid-template-columns : minmax(80px, 120px) 250px auto 140px 80px 120px;
	grid-gap              : 10px 10px;
}

.typelist.reaction {
	display               : grid;
	grid-template-columns : 40px 80px 180px auto 200px 160px 140px 140px;
	grid-gap              : 10px 10px;
}
.typelist.token {
	display               : grid;
	grid-template-columns : 150px auto 250px 120px;
	grid-gap              : 10px 10px;
}
.typelist.reports {
	display               : grid;
	grid-template-columns : 150px 250px auto 120px 140px;
	grid-gap              : 10px 10px;
}
.typelist.vacancylist {
	display               : grid;
	grid-template-columns : 350px auto 120px;
	grid-gap              : 10px 10px;
}
.typelist.smstemplate {
	display               : grid;
	grid-template-columns : 120px 100px 150px auto 150px;
	grid-gap              : 10px 10px;
}
.typelist .button.dotted {
	padding: 3px 5px !important;
	margin-right: 5px !important;
}

.typelist.disabled{
	color: var(--gray-dark) !important;
	background: var(--gray-lite);
}
.typelist.disabled .gray-dark,
.typelist.disabled .broun,
.typelist.disabled .red{
	color: var(--gray-dark) !important;
}
.typelist.disabled .infodiv.blue{
	color: var(--gray-dark) !important;
	background: var(--gray-lite);
	border-color: var(--gray-dark);
}

.statement {
	display               : grid;
	grid-template-columns : auto 140px 140px 170px;
	grid-gap              : 5px 5px;
}
.statement > div {
	padding : 15px 10px;
}
.statement.bank {
	display               : grid;
	grid-template-columns : auto 140px 140px 170px;
	grid-gap              : 5px 5px;
}

.statements {
	display               : grid;
	grid-template-columns : 120px 40px auto 120px 120px 5px;
	grid-template-rows    : auto;
	grid-gap              : 5px 5px;
}
.statements > div {
	padding : 5px 10px;
}

.complect {
	display               : grid;
	grid-template-columns : 250px auto 120px;
	grid-gap              : 10px 10px;
}
.complect > div {
	padding : 5px 10px;
}

.contragents {
	display               : grid;
	grid-template-columns : 90px auto 130px 130px 160px 5px;
	grid-template-rows    : auto;
	grid-gap              : 5px 5px;
}
.contragents > div {
	padding : 5px 10px;
}

.contacts {
	display               : grid;
	grid-template-columns : 90px 90px auto 130px 200px 250px 120px;
	grid-template-rows    : auto;
	grid-gap              : 5px 5px;
}
.contacts > div {
	padding : 5px 10px;
}

.rezults {
	display               : grid;
	grid-template-columns : 250px 250px auto 120px;
	grid-gap              : 10px 10px;
}
.rezults > div {
	padding : 5px 10px;
}

.three {
	display               : grid;
	grid-template-columns : auto 120px;
	grid-gap              : 10px 10px;
}
.three > div {
	padding : 5px 10px;
}

.detales {
	display               : grid;
	grid-template-columns : repeat(auto-fill, 100%);
	grid-gap              : 5px 5px;
	box-sizing            : border-box;
}

.weeks {
	display               : grid;
	grid-template-columns : 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-gap              : 2px;
	box-sizing            : border-box;
}

.tabbody[data-id="tab-mailer"] {
	display               : grid;
	grid-template-columns : 350px auto;
	/*grid-template-rows    : auto;*/
	grid-gap              : 0 2px;
	padding               : 0 !important;
	overflow-y            : hidden;
	height                : 100%;
}

.mailer-list {
	display            : grid;
	grid-template-rows : 40px auto 40px;
	height             : calc(100vh - 60px);
	border-right       : 0 solid var(--gray);
	box-shadow         : 1px 0 2px 0 rgba(50, 50, 50, 0.7);
	box-sizing         : border-box;
	overflow-y         : hidden;
}
.mailer-list .mailer--head {
	display               : grid;
	grid-template-columns : 20px auto 80px;
	background            : var(--gray);
	box-shadow            : 0 4px 2px -3px rgba(50, 50, 50, 0.5);
	z-index               : 1;
	line-height           : 40px;
}
.mailer-list .mailer--head .my3 {
	position      : absolute;
	left          : 55%;
	top           : 10px;
	font-size     : 0.8em;
	font-weight   : bold;
	line-height   : 1em;
	background    : var(--gray-lite);
	border-radius : 20px;
}
.mailer-list .mailer--head .mailer--actions {
	text-align : right;
}
.mailer-list .mailer--head .mailer--actions a {
	display    : inline-block;
	width      : 25px;
	height     : 40px;
	text-align : center;
	font-size  : 1.0em;
}
.mailer-list .mailer--list {
	overflow-y : auto;
}
.mailer-list .mailer--foot {
	line-height : 40px;
	padding     : 0 10px;
	color       : var(--gray-darkblue);
	background  : var(--gray-lite);
	box-sizing  : border-box;
	box-shadow  : 0 2px 2px 3px rgba(50, 50, 50, 0.5);
	z-index     : 9;
}
.mailer-list .mailer--foot a {
	color : var(--black);
}
.mailer-list .mailer--folder {
	line-height      : 40px;;
	font-size        : 1em;
	font-weight      : bold;
	padding          : 0 10px;
	text-overflow    : ellipsis !important;
	-o-text-overflow : ellipsis !important;
	overflow         : hidden !important;
	white-space      : nowrap;
}
.mailer-message {
	height     : calc(100vh - 60px);
	overflow-y : auto;
	box-sizing : border-box;
}
.mailer-folder {
	font-size   : 1.2em;
	font-weight : bold;
	color       : var(--white);
}

.bottom-block-mailer {
	position : absolute;
	bottom   : 37px;
	left     : 370px;
	z-index  : 1;
}
.bottom-block-mailer a {
	display       : inline-block;
	width         : 4rem;
	height        : 4rem;
	line-height   : 4rem;
	font-size     : 1.5rem;
	color         : var(--white);
	background    : var(--green);
	border        : 1px solid var(--green-dark);
	border-radius : 50px;
	text-align    : center;
	box-shadow    : 0 0 5px var(--green);
}


/**
Стиль для рабочего места оператора
 */
.tabbody[data-id="tab-feedback"] {
	display               : grid;
	grid-template-columns : 300px auto 50%;
	/*grid-template-rows    : auto;*/
	grid-gap              : 0 2px;
	padding               : 0 !important;
	overflow-y            : hidden;
	height                : 100%;
}

.feedback-list {
	display            : grid;
	/*grid-template-rows : 30px 30% 30px auto 30px 250px;*/
	grid-template-rows : 30px auto 30px 60%;
	height             : calc(100vh - 60px);
	border-right       : 0 solid var(--gray);
	box-shadow         : 1px 0 2px 0 rgba(50, 50, 50, 0.7);
	box-sizing         : border-box;
	overflow-y         : hidden;
}
.feedback-list > .head {
	padding     : 5px;
	font-size   : 0.9em;
	font-weight : 700;
	line-height : 20px;
	color: var(--green-dark);
	background  : var(--gray);
	border-bottom : 1px solid var(--gray-sub);
	box-sizing: border-box;
	overflow-y  : hidden;
	text-align: center;
}
.feedback-list > .recall,
.feedback-list > .list{
	overflow-y : auto;
}
.feedback-list > .recall .task-item,
.feedback-list > .list .feedback-item {
	border-bottom : 1px solid var(--gray);
	padding       : 5px;
}
.feedback-list > .recall .task-item.current,
.feedback-list > .list .feedback-item.current {
	background : var(--green-sublite);
}

.feedback-form {
	display            : grid;
	grid-template-rows : auto 80px;
	height             : calc(100vh - 60px);
	box-sizing         : border-box;
	box-shadow         : 1px 0 2px 0 rgba(50, 50, 50, 0.7);
	position           : relative;
}
.feedback-form .feedback-container {
	overflow-y : auto;
}
.feedback-form .button--pane {
	vertical-align : middle;
	border-top     : 1px solid var(--gray-sub);
	padding-top    : 15px;
	padding-bottom: 15px;
	background     : var(--gray);
	/*position: absolute;
	bottom: 0;
	left: 0;
	z-index: 5;*/
}
.feedback-form .feedback-roof{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--gray-lite);
	opacity: 0.9;
	z-index : 10;
}
.feedback-questions {
	display               : grid;
	grid-template-rows : 40% auto;
	height     : calc(100vh - 60px);
	overflow-y : auto;
	box-sizing : border-box;
	box-shadow : 1px 0 2px 0 rgba(50, 50, 50, 0.7);
}
.feedback-questions .questions{
	border-bottom : 2px solid var(--gray-sub);
}
.feedback-questions .map{

}
.feedback-questions .mapsearch{
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2000;
	padding: 5px 10px;
	background: var(--white);
	border-radius: 0 0 0 5px;
}

@media (min-width : 1500px) {

	.ui-layout {
		grid-template-columns : 300px auto;
	}
	.ui-navigation {
		grid-template-columns : 300px;
	}

	.bottom-block {
		left : 320px;
	}

	.typelist.vacancy {
		display               : grid;
		grid-template-columns : minmax(80px, 120px) 450px auto 140px 80px 120px;
		grid-gap              : 10px 10px;
	}
	.typelist.reaction {
		display               : grid;
		grid-template-columns : 80px 80px 250px auto 250px 180px 160px 160px;
		grid-gap              : 10px 10px;
	}

	.ui-layout.collapsed .ui-navigation ul.subtab li {
		font-size : 0.8em;
	}
	.ui-layout.collapsed .ui-navigation ul.subtab li.active,
	.ui-layout.collapsed .ui-navigation ul.subtab li:hover {
		font-weight : 400;
	}

	.mailer-list .mailer--head {
		display               : grid;
		grid-template-columns : 20px auto 120px;
		background            : var(--gray-lite);
		box-shadow            : 0 4px 2px -3px rgba(50, 50, 50, 0.5);
		z-index               : 1;
		line-height           : 40px;
	}
	.mailer-list .mailer--head .mailer--actions a {
		display    : inline-block;
		width      : 30px;
		height     : 40px;
		text-align : center;
		font-size  : 1.2em;
	}
	
	.contacts {
		display: grid;
		grid-template-columns: 90px 90px auto 180px 230px 250px 120px;
		grid-template-rows: auto;
		grid-gap: 5px 5px;
	}

	.bottom-block-mailer {
		left : 370px;
	}

}

@media (min-width : 1200px) and (max-width : 1500px) {
	
	.tabbody[data-id="tab-feedback"] {
		grid-template-columns : 250px auto 35%;
	}
	
	.feedback-questions {
		grid-template-rows : 50% auto;
	}
	
}

@media (min-width : 1200px) and (max-width : 1300px) {
	
	.typelist.reaction {
		grid-template-columns : 40px 80px 180px auto 140px 120px 120px 140px;
	}
	
}

@media (min-width : 1300px) and (max-width : 1500px) {
	
	.typelist.reaction {
		/*grid-template-columns : 40px 80px 140px auto 140px 120px 120px 140px;*/
		grid-template-columns : 50px 80px 200px auto 160px 100px 120px 140px;
	}
	
	.typelist .button.dotted {
		padding: 3px 5px !important;
		margin-right: 5px !important;
	}
	
}

@media (min-width : 1024px) and (max-width : 1200px) {

	.tabbody[data-id="tab-mailer"] {
		grid-template-columns : 250px auto;
	}
	
	.tabbody[data-id="tab-feedback"] {
		grid-template-columns : 230px auto 30%;
	}
	.feedback-list > .list .feedback-item {
		font-size: 0.9em;
	}

	.bottom-block-mailer {
		left : 270px;
	}

	.typelist.reaction {
		display               : grid;
		grid-template-columns : 40px 80px 150px auto 150px 120px 100px 140px;
		grid-gap              : 5px 5px;
		font-size             : 0.9em;
	}
	
	.contacts {
		grid-template-columns : 80px 70px auto 120px 160px 140px 120px;
	}

}

@media (min-width : 768px) and (max-width : 1024px) {
	
	body {
		font-size : 10px;
	}
	
	.typelist.reaction {
		grid-template-columns : 40px 60px 140px auto 120px 120px 100px 130px;
	}

	.statements {
		grid-template-columns : 80px 40px auto 100px 100px 5px;
	}

	.contragents {
		grid-template-columns : 70px auto 130px 130px 0 5px;
	}

	.contacts {
		grid-template-columns : 90px 70px auto 100px 100px 180px 120px;
	}

	.rezults {
		display               : grid;
		grid-template-columns : 160px 200px auto 120px;
		grid-gap              : 10px 10px;
	}

	.bottom-block {
		left : 280px;
	}

	.tabbody[data-id="tab-mailer"] {
		grid-template-columns : 220px auto;
	}

	.bottom-block-mailer {
		left : 270px;
	}

}

@media (max-width : 768px) {

	.tabbody[data-id="tab-mailer"] {
		grid-template-columns : 220px auto;
	}

	.bottom-block-mailer {
		left : 270px;
	}

}

.errorlist {
	display               : grid;
	grid-template-columns : minmax(100px, 200px) auto;
	grid-gap              : 10px 10px;
}
.errorlist > div {
	padding : 10px;
}

.backuplist {
	display               : grid;
	grid-template-columns : minmax(100px, 200px) auto 100px 100px 120px;
	grid-gap              : 10px 10px;
}
.backuplist > div {
	padding : 10px;
}

.loglist {
	display               : grid;
	grid-template-columns : minmax(100px, 140px) 100px auto 180px 120px;
	grid-gap              : 10px 10px;
}
.loglist > div {
	padding : 10px;
}

.translist {
	display               : grid;
	grid-template-columns : 100px auto minmax(130px, 180px) 120px;
	grid-gap              : 10px 10px;
}
.translist > div {
	padding : 10px;
}

.cards {
	margin-top            : 20px;
	display               : grid;
	grid-template-columns : repeat(auto-fill, 160px);
	grid-template-rows    : minmax(120px, auto);
	grid-gap              : 10px 10px;
}
.cards .carditem {
	display               : grid;
	grid-template-columns : 160px;
	grid-template-rows    : 100px 30px;
	grid-gap              : 0;
	position              : relative;
	justify-content       : center;
	align-items           : center;
	border-radius         : 5px;
	padding               : 10px;
	border                : 2px dashed var(--gray4);
}
.cards .carditem:hover {
	background : var(--liteblue);
}
.cards .carditem .logo {
	background-size : contain !important;
	height          : 100%;
}
.cards .carditem a.edit {
	font-size     : 0.8em;
	position      : absolute;
	top           : 0;
	right         : 0;
	width         : 20px;
	height        : 20px;
	line-height   : 20px;
	text-align    : center;
	background    : var(--gray-lite);
	border-radius : 5px;
}
.cards .carditem a.delete {
	font-size     : 0.8em;
	position      : absolute;
	bottom        : 0;
	right         : 0;
	width         : 20px;
	height        : 20px;
	line-height   : 20px;
	text-align    : center;
	color         : var(--red);
	background    : var(--red-sublite);
	border-radius : 5px;
}
.cards .carditem a.comment {
	font-size     : 0.8em;
	position      : absolute;
	top           : 0;
	left          : 0;
	width         : 20px;
	height        : 20px;
	line-height   : 20px;
	text-align    : center;
	color         : var(--gray-dark);
	background    : var(--gray-lite);
	border-radius : 5px;
}
.cards .carditem a.comment.active {
	color      : var(--orange-dark);
	background : var(--orange-lite);
}
.cards .carditem .carditem sup {
	position   : absolute;
	bottom     : 0;
	right      : 0;
	left       : auto;
	font-size  : 0.4em;
	color      : var(--white);
	font-style : normal;
}
.cards .carditem .carditem .block {
	cursor : pointer;
	height : 70%;
	width  : 100%;
}

.message {
	margin-bottom : 5px;
}

.inotify {
	display               : grid;
	grid-template-columns : 80px auto;
	grid-gap              : 5px 5px;
	margin-bottom         : 10px;
	border-radius         : 5px;
	border                : 1px solid var(--gray);
}
.inotify .inotify-item:first-child {
	display         : flex;
	align-items     : center;
	justify-content : center;
	text-align      : center;
}

.macs {
	display               : grid;
	grid-template-columns : repeat(auto-fit, calc(20% - 10px));
	grid-auto-rows        : minmax(40px, auto);
	grid-gap              : 10px 10px;
	margin-top            : 20px;
}
.macs .isearch {
	box-sizing : border-box;
	padding    : 15px;
	position   : relative;
}
.macs .isearch:hover {
	background : var(--gray);
	box-shadow : 0 2px 3px 0 rgba(0, 0, 0, .4);
}
.isearch .macdel {
	position      : absolute;
	top           : 0;
	right         : 0;
	width         : 30px;
	height        : 30px;
	line-height   : 30px;
	text-align    : center;
	background    : var(--red-sublite);
	border-radius : 0 0 0 5px;
}

/**
Переключатель языка
 */
.popblock {
	position : relative;
}

.popblock.open > a {
	background : rgba(0, 0, 0, 0.3) !important;
}
.popblock.open .popblock-menu {
	display : block;
}

.popblock-menu {
	display               : none;
	margin-top            : 10px;
	position              : absolute;
	z-index               : 20;
	left                  : 0;
	/*top: 100%;*/
	width                 : 250px;
	text-align            : left;
	font-size             : 1.0rem;
	line-height           : 1.1rem;
	/*padding : 5px;*/
	border                : 1px solid #BBB;
	box-shadow            : 1px 1px 3px #BBB;
	-webkit-box-shadow    : 1px 1px 3px #BBB;
	-moz-box-shadow       : 1px 1px 3px #BBB;
	-webkit-border-radius : 5px;
	-moz-border-radius    : 5px;
	border-radius         : 5px;
	background            : #FFF;
	color                 : #222;
	cursor                : default;
}
.popblock-menu:after,
.popblock-menu:before {
	position       : absolute;
	top            : -12px;
	left           : 25px;
	border         : solid transparent;
	content        : " ";
	height         : 0;
	width          : 0;
	pointer-events : none;
}
.popblock-menu:after {
	border-color        : rgba(136, 183, 213, 0);
	border-bottom-color : #BBB;
	border-width        : 6px;
	margin-left         : -6px;
}
.popblock-menu:before {
	border-color        : rgba(255, 255, 255, 0);
	border-bottom-color : #FFF;
	border-width        : 6px;
	margin-left         : -6px;
	top                 : -10px;
	left                : 25px;
	z-index             : 21;
}

.popblock-menu.right {
	left  : auto;
	right : 0;
}
.popblock-menu.right:after,
.popblock-menu.right:before {
	left  : auto;
	right : 18px;
}
.popblock-menu.right:before {
	left  : auto;
	right : 18px;
}

.popblock-menu.right20 {
	left  : auto;
	right : -20px;
}
.popblock-menu.right20:after,
.popblock-menu.right20:before {
	left  : auto;
	right : 20px;
}
.popblock-menu.right20:before {
	left  : auto;
	right : 18px;
}

.popblock .popblock-items {
	margin     : 0;
	/*max-height : 50vh;*/
	/*overflow-y : auto;*/
}
.popblock .popblock-item {
	position      : relative;
	color         : #222;
	padding       : 5px;
	cursor        : pointer;
	border-bottom : 1px solid var(--gray);
}
.popblock .popblock-item:last-child {
	border-bottom : 0;
}
.popblock .popblock-item:hover {
	background : var(--gray-lite);
}
.popblock .popblock-item.current {
	background : var(--biruza);
}
.popblock .popblock-item.disabled {
	cursor     : progress;
	background : var(--gray);
	color      : var(--gray-dark)
}

.border--bottom .popblock-item {
	padding-bottom : 5px;
	border-bottom  : #CCC 1px dotted !important;
}
.border--bottom .popblock-item:last-child {
	border-bottom : 0 !important;
}

.gcontainer {
	display               : grid;
	grid-template-columns : 250px 3px 300px;
	grid-gap              : 0;
}
.gcontainer.one {
	display               : grid;
	grid-template-columns : 300px;
	grid-gap              : 0;
}

.gstring{
	overflow-y: auto;
	max-height: 60vh;
}

.vigets {
	display               : grid;
	grid-template-columns : 1fr 1fr;
	grid-template-rows    : repeat(3, 350px); /*minmax(200px, auto);*/
	grid-gap              : 5px 5px;
}
.viget {
	border                : 1px solid #E6E9ED;
	background            : #FFF;
	padding               : 0;
	border-radius         : 5px;
	box-sizing            : border-box;
	box-shadow            : 0 1px 1px #BBB;
	display               : grid;
	grid-template-columns : 1fr;
	grid-template-rows    : 40px minmax(calc(100% - 40px), auto); /*minmax(200px, auto);*/
	grid-gap              : 0;
}
.viget .header {
	display        : table;
	color          : var(--gray-darkblue);
	background     : var(--gray-lite);
	font-size      : 0.8em;
	line-height    : 30px;
	height         : 30px;
	padding        : 5px 10px;
	font-weight    : 700;
	text-transform : uppercase;
}
.viget .body {
	display    : block;
	width      : 100%;
	overflow-y : auto;
	overflow-x : hidden;
	background : #FFF;
}

.ui-card {
	display: grid;
	grid-auto-rows: 60px auto 60px;
}
.ui-card.full {
	display: grid;
	grid-auto-rows: auto;
}

.crd--title {
	display     : block;
	width       : 100%;
	height      : 60px;
	background  : var(--gray-lite);
	font-size   : 1.6rem;
	font-weight : bold;
	padding     : 0 10px;
	line-height : 60px;
	box-shadow  : 0 0 2px 0 rgba(0, 0, 0, .6);
	box-sizing  : border-box;
	z-index     : 10;
	position    : relative;
}
.crd--body {
	padding    : 10px;
	overflow-y : auto;
	overflow-x : hidden;
	height     : calc(100vh - 120px);
	box-sizing : border-box;
	background : #FFF;
}
.ui-card.full .crd--body {
	height     : calc(100vh - 90px);
}
.crd--date {

}
.crd-content {

}
.crd--footer{
	width: 100%;
	background  : var(--gray-lite);
	box-sizing  : border-box;
	font-weight : 700;
	line-height : 60px;
	padding     : 0;
	margin      : 0 auto;
	color       : #222;
}

.clearinputs,
.delfilebox {
	position : absolute;
	top      : 25%;
	right    : 10px;
	width    : 20px;
	height   : 20px;
	cursor   : pointer;
}

.multi--buttons {
	position : fixed;
	bottom   : 40px;
	left     : 340px;
	z-index  : 100;
}

/*Заголовки div-таблиц*/
.tbl--header {
	color: var(--white);
	background : var(--green-lite);
	font-weight: bold;
}

/*Блок всплывающий для телефонии*/
.caller {
	position           : fixed;
	display            : none;
	z-index            : 12;
	font-size          : 1.05em;
	bottom             : 75px;
	right              : 10px;
	width              : 350px;
	min-height         : 200px;
	background         : #FFF;
	border             : 1px solid rgba(13, 71, 161, 0.7);
	-webkit-box-shadow : 0 1px 3px #222;
	-moz-box-shadow    : 0 1px 3px #222;
	box-shadow         : 0 1px 3px #222;
	border-radius      : 5px;
}
.caller:before {
	z-index      : 13;
	position     : absolute;
	bottom       : -4px;
	right        : 15px;
	content      : "";
	display      : inline-block;
	width        : 0;
	height       : 0;
	border-style : solid;
	border-width : 7px 7px 0 7px;
	border-color : #FFF transparent transparent transparent;
}
.caller:after {
	position     : absolute;
	bottom       : -7px;
	right        : 15px;
	content      : "";
	display      : inline-block;
	width        : 0;
	height       : 0;
	border-style : solid;
	border-width : 7px 7px 0 7px;
	border-color : rgba(13, 71, 161, 0.7) transparent transparent transparent;
}
.caller ul, .caller ol {
	padding : 0;
	margin  : 0;
}
.caller .header {
	font-size  : 1.0em;
	padding    : 10px;
	background : rgba(13, 71, 161, 0.7);
}
.caller .header.top {
	border-top-left-radius  : 4px;
	border-top-right-radius : 4px;
}
.caller .btn {
	margin-right : 10px;
	font-size    : 0.8em;
	font-weight  : 600;
}
.caller .carda {
	display     : block;
	font-size   : 1.00em;
	font-weight : 600;
	padding     : 5px 20px;
}
.caller .hid {
	position : absolute;
	float    : right;
	z-index  : 101;
	top      : 8px;
	right    : 5px;
	cursor   : pointer;
	width    : 20px;
	height   : 20px;
	/*color:#FFC235;*/
}
.caller .hid:hover {
	color : #BB8300;
}
.caller b {
	font-weight : 700;
	/*color:#000;*/
}
.caller hr {
	width      : 99%;
	border     : 0 none;
	border-top : #CCC 1px dotted;
	/*border-top: 1px solid #2387CA;*/
	padding    : 0;
	height     : 1px;
	margin     : 5px 0;
	clear      : both;
}

.caller #peerlist {
	max-height : 400px;
	/*min-height : 100px;*/
	overflow-y : auto;
}
.caller #peerlist li {
	/*max-height: 400px;*/
	list-style        : none;
	line-height       : 16px;
	padding           : 2px 0;
	overflow          : hidden;
	/*border-bottom     : 1px dotted #DDD;*/
	text-overflow     : ellipsis;
	-ms-text-overflow : ellipsis;
	-o-text-overflow  : ellipsis;
}
.caller #peerlist .peerone {
	line-height : 20px;
}

.caller #inpeerlist {
	max-height : 30vh;
	overflow-x : auto;
}
.caller #inpeerlist ol li {
	list-style : decimal;
}
.caller #inpeerlist li {
	line-height       : 16px;
	padding           : 2px 0;
	overflow          : hidden;
	background        : #FFF;
	text-overflow     : ellipsis;
	-ms-text-overflow : ellipsis;
	-o-text-overflow  : ellipsis;
}

.caller #rezult {
	background  : #FFF;
	color       : #222;
	font-size   : 0.95em;
	line-height : 1.2em;
	/*overflow    : auto;*/
	max-height  : 300px;
	text-align  : center;
}
.caller #rezult2 {
	border-top  : 0;
	background  : #FFF;
	color       : #222;
	font-size   : 0.8em;
	padding     : 3px;
	line-height : 1.2em;
	overflow    : auto;
	max-height  : 300px;
}

.caller #lastcolls .clist {
	display        : block;
	font-size      : 0.9em;
	padding-top    : 5px;
	padding-bottom : 5px;
}
.caller #lastcolls .clist:hover {
	color            : #2E658D;
	background-color : #D2E9FF;
}
.caller #lastcolls .icons {
	padding-left  : 5px;
	padding-right : 5px;
	/*border:1px dotted red;*/
	width         : 40px;
}
.caller #lastcolls .time {
	padding-left  : 5px;
	padding-right : 5px;
	/*border:1px dotted red;*/
	display       : inline-block;
	width         : 60px;
}
.caller #lastcolls .tel {
	padding-left  : 5px;
	padding-right : 5px;
	display       : inline-block;
}
.caller #lastcolls .title {
	padding-left : 5px;
	display      : block;
	overflow     : hidden;
}

.calllink {
	display  : inline-block;
	position : relative;
}

.caller .hangup {
	float     : right;
	position  : absolute;
	top       : 5px;
	right     : 3px;
	font-size : 1.5em;
}
.caller .rezult {
}
.caller .ctriangle-white {
	position     : absolute;
	z-index      : 101;
	bottom       : 20px;
	left         : 0;
	margin-left  : -7px;

	border-style : solid;
	border-width : 7px 7px 7px 0;
	border-color : transparent #FFF transparent transparent;

}
.caller .ctriangle {
	position     : absolute;
	z-index      : 100;
	bottom       : 20px;
	left         : 0;
	margin-left  : -8px;

	border-style : solid;
	border-width : 7px 7px 7px 0;
	border-color : transparent #CCC transparent transparent;
}

.caller--icon {
	background : var(--green) !important;
	border     : 2px solid var(--green-dark) !important;
}

.height100{
	height: 100%;
	box-sizing: border-box !important;
}

/**
Расписание
 */
.schedulebox{
	display: grid;
	grid-template-rows: 1fr 18fr;
	grid-auto-rows: auto;
	/*width: 100%;*/
	border: 1px solid var(--gray-dark);
	overflow-y: auto;
	max-height: 65vh;
	height: 65vh;
}
.schedulebox .sch-header{
	display: grid;
	grid-template-columns: 100px 3fr 3fr 3fr 3fr 3fr 2fr 2fr;
	grid-gap: 0;
	background: var(--biruza-lite);
	height: 2em;
}
.schedulebox .sch-body{
	display: grid;
	grid-template-columns: 100px 3fr 3fr 3fr 3fr 3fr 2fr 2fr;
	grid-template-rows: repeat(18,2.0em);
	grid-gap: 0;
}
.schedulebox .sch-day,
.schedulebox .sch-time{
	padding: 0;
	box-sizing: border-box;
	line-height: 2.0em;
}
.schedulebox .sch-time{
	border-right: 1px solid var(--white);
	border-bottom: 1px solid var(--white);
	height: 2.0em;
}
.schedulebox .sch-time:first-child{
	border-top: 1px solid var(--white);
}
.schedulebox .sch-header .sch-day{
	text-align: center;
	font-weight: bold;
	border-right: 1px solid var(--gray-dark);
	border-bottom: 1px solid var(--gray-dark);
}
.schedulebox .sch-body .sch-timecol .sch-time{
	text-align: right;
	padding-right: 10px;
	font-weight: bold;
	background: var(--biruza-lite);
	height: 2.0em;
}
.schedulebox .sch-body .sch-day{
	display: grid;
	grid-template-rows: repeat(18,2.0em);
	grid-gap: 0;
}
.schedulebox .sch-header .weekend{
	background: var(--gray);
	color: var(--gray-darkblue);
}
.schedulebox .sch-body .weekend .sch-time{
	background: var(--gray);
}
.schedulebox .sch-adder{
	display: block;
	width: 100%;
	/*height: 2.0em;*/
	text-align: center;
	cursor: pointer;
	color: var(--green-dark);
}
.schedulebox .sch-adder:hover{
	background: var(--green-dark);
	color: var(--orange-lite);
}
.schedulebox .sch-body .sch-day .sch-time.today{
	background: var(--orange-lite);
}
.schedulebox .sch-body .sch-day .sch-time.nowork{
	background: var(--gray-sub) !important;
}
.schedulebox .sch-body .sch-day .sch-time.noadd{
	display: block;
	width: 100%;
	/*height: 2.0em;*/
	text-align: center;
	background: var(--red-sublite) !important;
}
.schedulebox .sch-body .sch-day .sch-time.selected{
	background: var(--orange-dark);
	color: var(--orange-lite);
}
.schedulebox .sch-count{
	position: absolute;
	top: 0;
	right: 5px;
}

.solvobox{
	display: grid;
	grid-template-columns: 3fr 7fr;
	grid-auto-rows: auto;
	overflow: hidden;
	height: 95%;
}
.solvobox .solvobox-city{
	overflow-y: auto;
	padding: 5px;
}
.solvobox .solvobox-city .city-item{
	cursor: pointer;
}
.solvobox .solvobox-city .city-item:hover{
	background: var(--biruza);
}
.solvobox .solvobox-city .city-item.selected{
	background: var(--biruza);
}
.solvobox .solvobox-points{
	display: grid;
	grid-template-rows: 70px auto;
	overflow-y: auto;
	padding: 5px;
}
.solvobox .point-item{
	cursor: pointer;
}
.solvobox .point-item:hover{
	background: var(--biruza);
}

@media all and (-webkit-min-device-pixel-ratio : 0) {

	sup {
		position    : relative;
		left        : 5px;
		font-size   : 0.65em;
		font-weight : 600
	}

	.sup {
		position     : relative;
		left         : -5px;
		top          : -5px;
		margin-right : -10px;
		font-size    : 0.65em;
	}

	i.sup {
		position     : relative;
		left         : -5px;
		top          : -5px;
		margin-right : -10px;
		font-size    : 0.65em;
	}

	fieldset {
		font-size : 1.05em;
	}

	fieldset .batton-edit {
		top : 15px;
	}

}

@media (min-width : 1500px) {

	.multi--buttons {
		left : 380px;
	}

}

@media (min-width : 1367px) {

	.vigets {
		grid-template-columns : 1fr 1fr;
		grid-template-rows    : repeat(3, 350px);;
		grid-gap              : 10px 10px;
	}

}

@media (min-width : 1025px) and (max-width : 1366px) {

}

@media (min-width : 768px) and (max-width : 1024px) {

	.macs {
		grid-template-columns : repeat(auto-fit, calc(33% - 10px));
	}

	#dtabs, #dtabs ul li,
	#dtabs ul li i {
		font-size : 0.95em;
	}

	#dtabs ul li.hidden-ipad {
		display : none;
	}

	.elipsis {
		text-overflow    : ellipsis !important;
		-o-text-overflow : ellipsis !important;
		overflow         : hidden !important;
		white-space      : nowrap;
		width            : 88%;
		margin-right     : -9999px;
	}

	h3 {
		font-size : 1.2em;
	}

	legend {
		font-size : 0.95em;
	}

	.multi--buttons {
		left : 340px;
	}

	.hidden-ipad {
		display : none !important;
	}

}

@media (max-width : 1025px) {

	.avatar--image {
		width      : 40px;
		margin-top : 5px;
	}

	.avatar--logo {
		width           : 40px;
		height          : 40px;
		background      : url("../images/logo-icon.png") no-repeat center center;
		background-size : 80%;
		background-size : contain;
		border          : 2px solid var(--gray-darkgray);
		border-radius   : 60px;
	}

	.ui-layout {
		grid-template-columns : 60px auto;
	}

	.ui-navigation {
		grid-template-columns : 60px;
	}

	.ui-navigation .tabs {
		overflow : unset;
	}

	li.ytab {
		position   : relative;
		text-align : center;
	}

	li.ytab > a > .text,
	li.ytab > a > .arrow {
		display : none;
	}

	.ui-navigation .footer > a > .text {
		display : none;
	}

	.ui-navigation ul.subtab {
		position   : absolute;
		left       : 100%;
		top        : 0;
		z-index    : 50;
		width      : 250px;
		background : var(--gray-darkgray);
		color      : var(--biruza);
		text-align : left;
		display    : none;
		box-shadow : 0 4px 2px -3px rgba(50, 50, 50, 0.5);
	}

	.ui-navigation ul.subtab li {
		font-size   : 1em;
		line-height : 40px;
	}

	.ui-navigation .footer a {
		text-align : center;
	}

	.ui-navigation > ul > li.ytab.current > .text {
		color : var(--gray-darkblue) !important;
	}

	.ui-navigation ul.subtab li:hover,
	.ui-navigation ul.subtab li.active {
		color       : var(--gray-darkblue);
		background  : var(--biruza);
		font-weight : 700;
	}

	.ui-navigation ul li.ytab.current li:hover .text,
	.ui-navigation ul li.ytab.current li.active .text {
		color : var(--gray-darkblue) !important;
	}

	.ui-navigation ul li.ytab:hover .subtab {
		display : block;
	}

	.ui-navigation ul.subtab li:last-child {
		margin-bottom : 0;
	}

	.ui-navigation ul.subtab .subtitle {
		display     : block;
		background  : var(--gray-darkblue);
		color       : var(--gray3);
		line-height : 10px;
		padding     : 5px 20px;
		font-size   : 0.8rem;
		position    : -webkit-sticky;
		position    : sticky;
		top         : 0;
		z-index     : 10;
	}

	.ui-navigation ul.subtab {
		max-height : 65vh;
		overflow-y : auto;
	}

	.bottom-block {
		left : 80px;
	}

	.multi--buttons {
		left : 140px;
	}

	.ui-navigation ul.subtab li span:first-child {
		width        : 30px;
		margin-right : 5px;
		margin-left  : 5px;
		padding-left : 0;
	}

	.toggle--menu {
		display : none !important;
	}

}

@media (max-width : 767px) {

	.ui-navigation ul.subtab {
		max-height : 50vh;
		overflow-y : auto;
	}

	.macs {
		grid-template-columns : repeat(auto-fit, calc(50% - 10px));
	}

	.container {
		width : 96vw;
		/*margin: 0 auto;*/
	}

	.header #dtabs {
		font-size   : 0.95em;
		line-height : 1.05;
	}

}