@import '../scripts/extjs-5/build/packages/ext-theme-crisp/build/resources/ext-theme-wt.css';


body{
	margin: 0;
	padding: 0;
	height: 100%;
	background-color: #f3f3f4;
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 15px;
	color: #313a4a;
}

html {
	height: 100%;
	font-size: 10px; /* base size for rem */
}

@media print { body { transform: scale(1); } }

div, p, span, a, input, textarea, keygen, select, button{
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
}

hr { margin-bottom: 0px; margin-top: 0px; }

input[type=text],input[type=number], input[type=password], textarea{
	border: 1px solid #c9ccd4;
	border-radius: 2px;
	padding: calc(8px + 2px);
	font-size: 15px;
	box-shadow: inset 0 1px 3px #DDDDDD;
}

.x-form-textarea { border: 1px solid #c9ccd4 }

input[type=text]:focus,input[type=number]:focus, input[type=password]:focus, textarea:focus{
	border: 1px solid #4176ea;
}

.cssXPDatePicker input[type=text]:focus { border: 0px solid transparent }

input[type=button],input[type=submit], button, a.button {
	-webkit-appearance: none;
	border: 1px solid #4176ea;
	/* padding: 13px 23px; */
	padding: 8px 16px;
	border-radius: 2px;
	background-color: transparent;
	color: #4176ea;
	font-size: 14px;
	cursor: pointer;
	margin: 8px 0;
}
input[type=button]:hover,
input[type=submit]:hover, button:hover, a.button:hover
{

/* 	border-color: #355bbb;
	color: #355bbb; */
	border-color: #4176ea;
	background-color: #4176ea;
	color: #FFFFFF;
}
input[type=text], input[type=password], textarea{
	background-color: #ffffff;
	border: 1px solid #c9ccd4;
}


.auth-mobile-container { display: block; margin: 0px 24px; }
.password-container { position: relative; }
.password-icon { cursor: pointer; position: absolute; top: 10px; right: 10px; color: #c9ccd4; }
input.auth-mobile { width: 100%; border: 0px solid transparent; box-shadow: none; border-bottom: 1px solid #c9ccd4; box-sizing: border-box; margin-bottom: 16px;  font-size: 19px; }

.XAML-input-date { width: 105px; min-width: 105px; max-width: 105px; }
.XAML-input-datetime { width: 160px; min-width: 160px; max-width: 160px; }
.XAML-input-small { width: 160px; min-width: 160px; max-width: 160px; }
.XAML-input-medium { width: 300px; min-width: 300px; max-width: 300px; }
.XAML-input-large { width: 500px; min-width: 500px; max-width: 500px; }

a.button{
	display: inline-block;
}

a, a:visited{
	color: #4176ea;
	text-decoration: none;
}
a:hover, a:active{
	color: #355bbb;
	text-decoration: none;
}


td{
	padding: 0;
	margin: 0;
}


body{ }

.x-mask { background-color: rgba(142, 142, 143, 0.5); }


/*-------------------------- Р—РѕРЅС‹ ------------------------*/
.page{
	padding-top: 64px;
}

header{
	height: 64px;
    background-color: #FFFFFF;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
	border-bottom: 1px solid #ebebec;
	z-index: 999;
}

@media screen and (min-width:0\0) { /* IE 9+ hack*/
	header{
		border-top: 1px solid #ebebec;
	}

}

.navigation{
	background-color: #ffffff;
	border-collapse: separate;
	box-shadow: 0 0 10px rgba(0,0,0,0.11);
}

.page-content{
	width: 1176px;
    margin: 0 auto;
	padding: 40px 0 8px 0;
	min-height: 70px;
	display: table;
	box-sizing: border-box;
}


.logo-container{
	float:left;
	margin: 0 16px;
}
.logo-container a{
	height: 64px;
    display: table-cell;
    vertical-align: middle;
}
.header-content{
}

.header-top, .header-middle, .header-bottom{
}

/* ---- Правильная работа элементов в шапке - начало */

.header-top { white-space: nowrap; }

#wt-header-top-right, #wt-header-top-center { display: inline-block }
#wt-header-top-right { right: 0; position: absolute; background-color: #FFFFFF; display: inline-block; }


@media screen and (max-width: 500px) {
.WTCSS-search { display: none }
}

/* ---- Правильная работа элементов в шапке - конец ---- */


.zone-main{
	/* float: left; */
	display: inline-block;
	width: 100%;
}
.page-columns-2 .zone-main{
	width: calc(100% - 240px);
}
.page-columns-3 .zone-main{
	width: calc(100% - 480px);
}

.zone-left{
	width: 216px;
	float: left;
	display: inline-block;
	margin-right: 24px;
}
.zone-right{
	width: 216px;
	float: right;
	display: inline-block;
	margin-left: 24px;
}
/*------------------ Страница авторизации ----------------*/
body.default .content-container {  background-color: #f3f3f4; }

.login-block{
	background-color: #ffffff;
	padding: 8px;
	border-radius: 4px;
	max-width: 700px;
	margin: 100px auto;
	border-collapse: separate;
    box-shadow: 0 0 10px rgba(0,0,0,0.11);
}
.login-block .logo{
	background-image: url(design/default/images/logo.png);
	background-position: top left;
	background-repeat: no-repeat;
	width: 120px;
	height: 29px;
}
.login-block .logo-container{
	margin: 24px;
}
.login-header{
	padding: 24px;
	text-align: center;
	font-size: 24px;
}

.login-content{
	/* margin: 24px; */
}
.login-text,
.login-comment{
	clear: both;
	margin: 24px;
}

.mode-user_form .login-block .XAML-label-header-1 {margin-top: 12px; margin-bottom: 0px; }
.mode-user_form .login-block .XAML-grid-container { padding: 0px 24px 12px 24px; }
.mode-user_form .login-block .cssXPStackPanel { padding: 12px 24px; }
.mode-user_form .login-block .XAML-grid-container .cssXPStackPanel { padding: 0px 0px; }
.mode-user_form  .login-block .cssXPHTMLBox { padding-top: 24px }
.mode-user_form .login-block .XAML-grid-info-table { padding: 24px 0px 0px 0px; }
.mode-user_form .login-block .XAML-grid-info-table>table { border-right: 0px solid !important }

.login-block .toolbar{
	text-align: center;
	margin: 8px 0;
}
.login-block .toolbar button{
	margin-left: 4px;
	margin-right: 4px;
	min-width: 96px;
}

.login-block .field-container{
	text-align: center;
	margin: 8px 0;
}
.login-block .field-container>div{
	display: inline-block;
}
.login-block .login-label{
	min-width: 72px;
	margin-left: -35px;
	text-align: right;
	padding: 8px;
}
.password-reminder .login-label { min-width: 180px }
.login-block .field-container input{
	min-width: 192px;
}
.login-block .field-container .fa{
	font-size: 19px;
	display: inline-block;
    width: 19px;
}
/*-------------------------- Меню ------------------------*/
.menu ul{
	padding: 0;
	margin: 0;
	list-style: none;
	white-space: nowrap;
}
.menu-mobile, .menu-mobile-button-container{
	display: none;
}
.menu-main{
	float:left;
	max-height: 64px;
	overflow: hidden;
}
.menu-main li{
	float: left;
	height: 64px;
	display: table;
}
.menu-main .menu-item a{
	color: #313a4a;
	font-size: 17px;
	font-weight: 500;
	padding: 16px;
    display: table-cell;
    vertical-align: middle;
	border-bottom: 2px solid #ffffff;
	cursor: pointer;
}
.menu-main .menu-item a:hover,
.menu-main .menu-item a:active,
.menu-main .menu-item a.active{
	color: #4176ea;
	border-bottom: 2px solid #4176ea;
}

.menu-main .menu-item a.menu-icon {
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 28px;
}

.main-menu-dropdown{
	position: fixed;
    top: 64px;
	left: 0px;
	z-index: 999;
	width: 100%;
	background-color: #ffffff;
	border-top: 0px solid  #ebebec;
	border-bottom: 1px solid #ebebec;
/*	padding: 16px; */
	display: none;
}
.menu-desc{
	float: left;
    max-width: 20%;
	display: table-cell;
}
.menu-content{
	float: left;
	display: table-cell;
}
.menu-desc-title{
	font-size: 19px;
	line-height: 1em;
	margin-bottom: 16px;
}
.menu-desc-img{
/*	max-width: 200px; */
	max-width: 100%;
}

.menu-desc-short { white-space: normal }

.menu-content-column{
	float: left;
	margin: 24px;
}
.main-menu-dropdown .menu-item{
	margin: 8px;
}

.main-menu-dropdown .menu-item.menu-item-level-1 {
	margin: 0px 8px 8px 8px;
}

.main-menu-dropdown .menu-item.menu-item-level-2{
	margin: 0px 8px 8px 8px;
}


.main-menu-dropdown .menu-item-level-1 a{
	color: #313a4a;
	font-size: 17px;
}
.main-menu-dropdown .menu-item-level-1:hover a{
	color: #4176ea;
	font-size: 17px;
}

.main-menu-dropdown { left: auto; width: auto; border-left: 0px solid #E0E0E0; border-right: 1px solid #E0E0E0; }
.menu-desc { background-color: #4176ea; padding: 24px; width: 300px !important; max-width: none !important; 	}
.menu-desc a.button { border: 1px solid #FFF; color: #FFFFFF }
.menu-content { min-width: 400px; border-top: 1px solid #ebebec; }

.menu-item-level-2 { margin-left: 16px !important }

.menu-desc-title { color: #FFF }
.menu-desc-short { color: #FFF }

.menu-btn {}

/*--------------------- Блок поиска ------------------------*/
header .block-search{
	float: right;
	color: #969eb2;
	border-left: 1px solid #ebebec;
	padding: 0px 8px;
}
header .search-input{
	height: 64px;
    padding: 0 16px;
    border: 0;
    box-shadow: none;
	font-size: 15px;
	color: #969eb2;
	width: 120px;
}

header .search-input:focus {
	border: 0px solid transparent;
}

header .block-search icon{
	padding-right: 16px;
}

.SearchGrid .x-grid-with-row-lines { top: 0px !important; }
.SearchGrid .wt-column-cell-type-image img { max-width: 24px !important }

/*----------- Блок информации о пользователе ----------------*/
header .block-user-info{
	height: 64px;
	float: right;
	border-left: 1px solid #ebebec;
}

header #wt-header-top-left .block-user-info{ float: left } /* Убираем привязку к правому краю при расположении блока ФИО слева */

header .block-user-info .wrapper{
	display: table;
	box-sizing: border-box;
    vertical-align: middle;
	height: 100%;
	padding: 8px 16px 8px 24px; /* Педдинг справа делаем меньше, он компенсируется правым отступом у содержимого*/
}
header .block-user-info .user-cabinet{
	display: table-cell;
    vertical-align: middle;
}
.block-user-info .user-cabinet{
	/*float: left;		*/
	margin-left: 8px;
}

.block-user-info .username, .block-user-info .exit-button-container, .block-user-info .user-photo-container, .block-user-info .button-dropdown{
	margin-right: 8px;
}

/*
.user-photo-container icon{
	color: #969eb2;
}
.exit-button-container i{
	color: #969eb2;
}
*/

.block-user-info a{
	color: #313a4a;
	font-size: 15px;
}
.block-user-info a:hover{
	color: #4176ea;
}
.block-user-info .user-photo{
	width: 40px;
    height: 40px;
    border-radius: 50%;
	background-size: cover;
    background-position: center;
}
.block-user-info .button-dropdown{
	width: 24px;
	height: 24px;
	background: url(design/default/images/arrow_down_gray.png) center center no-repeat;
	cursor: pointer;
}
.block-user-info .dropdown{
	display: none;
    position: absolute;
    z-index: 9999;
    right: 0;
    top: 64px;
    width: 250px;
    background-color: #ffffff;
    border: 1px solid #c9ccd4;
    padding: 10px;
}
.block-user-info .dropdown .title{
	font-weight: 500;
	text-align: center;
}
.block-user-info .dropdown ul{
	padding: 0;
    margin: 0;
    list-style: none;
    white-space: nowrap;
}
.block-user-info .dropdown li{
	margin: 16px 0;
}
.block-user-info .dropdown .link-container{
	width: 100%;
}
.block-user-info .dropdown .link-container a{
	font-weight: 500;
}
.block-user-info .dropdown .close-box{
	text-align: right;
}
/*----------------------- Breadcrumbs-----------------------*/

.breadcrumbs{
	width: 1176px;
    margin: 0 auto;
	padding: 16px 0;
	font-size: 13px;
}

.breadcrumbs .path-parent, .path-divider{
	color: #969eb2;
}
.breadcrumbs .path-parent:after{
}

.breadcrumbs .path-current{
	color: #313a4a;
}

.breadcrumbs .path-divider:after{
	font-size: 13px;
	content: " \00BB\00A0 ";
}

/*-------------------------- Footer -------------------------*/
.footer{
    width: 100%;
	background-color: #ebebec;
	color: #727a8d;
}
.footer-center{
	display: inline-block;
    width: 100%;
}
.footer-content{
	width: 1176px;
    margin: 0 auto;
	font-size: 13px;
}
.footer-content .copyright{
	padding: 16px 0;
	float: left;
}
.footer-content .view-switch{
	padding: 16px 0;
	float: right;
}

.copyright-container{
	padding: 0 16px;
}
/*-------------------------- Icons -------------------------*/
.icon-2x{
	font-size: 2em;
}
.icon-error-color, .icon-critical-color{
	color: red;
}
.icon-info-color{
}
.icon-warning-color{
	color: #ff9c00;
}
/*-------------------------- End of Icons ---------------------*/


/*============================= Заголовки ==========================*/

h1, .XAML-label-header-1, .XAML-label-template-title, .XAML-object-title-label, .page-title {
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 44px;
	font-weight: 300;
	margin: 0 0 calc(40px - 5px) 0;
	line-height: 1em;
}
h2, .XAML-label-header-2, .XAML-label-block-header {
	font-family:  'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 34px;
	font-weight: 300;
	margin: 0 0 calc(24px - 4px) 0;
	line-height: 1em;
}
h3, .XAML-label-header-3 {
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight: normal;
	margin: 0 0 16px 0;
}
h4, .XAML-label-header-4 {
	font-family: 'Roboto', sans-serif;
	font-size: 17px;
	font-weight: 500;
	margin: 0 0 8px 0;
}

h5, .XAML-label-header-5 {
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-weight: 500;
	margin: 0 0 8px 0;
}

h6, .XAML-label-header-6 {
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-weight: 300;
	margin: 0 0 8px 0;
}

/*============================= XAML ==========================*/

.XAML-image-link { cursor: pointer }

/*--------------- TabControl ----------------*/

.cssXPTabControl-left .x-tabpanel-child .x-panel-body { overflow-x: auto; }

.cssXPTabControl-top{
	/* background-color: #ffffff;
    border-radius: 4px;
	box-shadow: 0 0 10px rgba(0,0,0,0.11);*/
	/*padding: 24px ;*/
}
.cssXPTabControl-top .x-tab-bar{
	padding: 0 0 /* 16px */;
	border-bottom: 1px solid #f3f3f4;
	margin-bottom: 16px;
}

.cssXPTabControl-top.XAML-uni-content-container .x-tab-bar{
	padding: 0 16px;
	margin-bottom: 0;
}

.XAML-tabcontrol-filter .x-tab-bar{
	padding: 0 16px;
	border-bottom: 1px solid #f3f3f4;
	/* margin-bottom: 16px; */
}

.cssXPTabControl-top .x-tab-bar-scroller{
	padding: 0; /* При скроллинге на мобильном появляются стрелки, педдинг убираем */
}

.cssXPTabControl-top>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default {
	color: #313a4a;
	padding-top: 0px;
	padding-bottom: 16px; /* Добавляем к педдингу ширину подчеркивания активного элемента (нижней границы)*/
	padding-left: 8px;
	padding-right: 8px;
	border-bottom: 2px solid transparent;
	border-top: 2px solid transparent;
	margin-bottom: 16px !important;

}

.cssXPTabControl-top.XAML-uni-content-container>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default {
	padding-top: 16px;
}

.XAML-tabcontrol-filter>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default{
	color: #313a4a;
	padding-top: 16px;
	padding-bottom: 16px; /* Добавляем к педдингу ширину подчеркивания активного элемента (нижней границы)*/
	padding-left: 8px;
	padding-right: 8px;
	border-bottom: 2px solid transparent;
	border-top: 2px solid transparent;
	margin-bottom: 16px !important;
}


@media screen and (min-width: 980px){
	.cssXPTabControl-top>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default{
/*		position: relative !important;
		left: auto !important; 84636 */
		margin: 0 0 /* 8px*/ !important; /* Исправление табов при наезжании */
		display: inline-block;
		padding-left: 8px !important;
		padding-right: 8px !important;
	}
}

.x-tab-bar-default-top .x-box-scroller-tab-bar-default { margin-top: -20px }

.cssXPTabControl-top>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default.x-tab-active{
	color: #4176ea;
	border-bottom: 2px solid #4176ea;
	/* padding-bottom: 16px; */
}
.cssXPTabControl-top .x-tabpanel-child{
	/* padding: 16px;	 */
}

.cssXPTabControl-left>.x-tab-bar-left{
	border: 1px solid #c9ccd4;
	border-radius: 4px;
	margin: 0 /*16px */ 24px 16px 0;
	width: 192px;
}
.cssXPTabControl-left>.x-tab-bar-left>.x-tab-bar-body{
	padding: 24px;
}
.cssXPTabControl-left a.x-tab-left{
	color: #313a4a;
	margin-bottom: 16px !important;
	/* width: 192px; */
	/* position: relative !important; */
    /* top: 0 !important; */
}

.cssXPTabControl-left .x-box-target a.x-tab-left:last-child {
	margin-bottom: 0px !important;
}

.cssXPTabControl-left a.x-tab-left.x-tab-active,
.cssXPTabControl-left a.x-tab-left:hover{
	color: #4176ea;
}
.cssXPTabControl-left>.x-panel-body{
	/* background-color: #ffffff;
	border-radius: 4px; */
	margin: 0 0 8px 0;
}

.XAML-tabcontrol-invisible>.x-box-inner>.x-box-target>.cssXPTabItem>.concertinaHeader{
	display: none;
}
.XAML-tabcontrol-invisible>.x-box-inner>.x-box-target>.cssXPTabItem.x-collapsed{
	display: none;
	width: 0 !important;
}
.XAML-tabcontrol-invisible>.x-box-inner>.x-box-target>.cssXPTabItem>.x-accordion-body{
	left: 0 !important;
	width: 100% !important;
}

.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default>.x-tab-wrap { background-color: #f3f3f4; } /* Убираем наезжание подложки таба на его нижнюю границу в IE */

/*----------------- Edit ------------------*/
.XAML-edit-label .x-form-trigger-wrap
{
	border: 0;
}

.XAML-edit-label input{
	background-color: transparent;
	box-shadow: none;
}
.XAML-edit-label-title .x-form-text
{
	border: 0;
	font-weight: 500;
	font-size: 16px;
	width: 100%;
}
.XAML-edit-label-title{
	width: 100% !important;

}
.XAML-edit-label-title .x-form-text-field-body-default{
	max-width: 100%;
	width: 100%;
}

/*--------------- DataGrid ----------------*/
.cssXPDataGrid,
.cssXPResourceFieldGridSelect{
	/* margin: 16px 24px; */
	margin: 0 0 24px 0;
	width: auto !important;
	background-color: #ffffff;
	padding: 24px 24px;
	border-radius: 4px;
}
.cssXPDataGrid .x-grid-header-ct,
.cssXPResourceFieldGridSelect .x-grid-header-ct{
	color: #969eb2;
	background-color: #f3f3f4;
	margin-bottom: 8px;
	padding: 0 /* 24px */ 0;
}

.cssXPDataGrid .x-grid-header-ct .x-column-header-first,
.cssXPResourceFieldGridSelect .x-grid-header-ct .x-column-header-first { padding-left: 16px }

.cssXPDataGrid .x-grid-header-ct .x-column-header-last,
.cssXPResourceFieldGridSelect .x-grid-header-ct .x-column-header-last { padding-right: 16px }

.cssXPDataGrid .x-column-header,
.cssXPResourceFieldGridSelect .x-column-header{
	font-size: 14px;
	padding: calc(16px - 3px) 8px;
}
.cssXPDataGrid .x-column-header-focus,
.cssXPResourceFieldGridSelect .x-column-header-focus{
	/*border-width: 10px !important;*/
	color: #4176ea;
}

.x-column-header-sort-DESC .x-column-header-text { background-image: url(design/default/images/sort-desc.png); }
.x-column-header-sort-ASC .x-column-header-text { background-image : url(design/default/images/sort-asc.png); }

.cssXPDataGrid .x-grid-cell,
.cssXPResourceFieldGridSelect  .x-grid-cell{
	padding: 16px 8px;
}

.cssXPDataGrid .x-grid-item,
.cssXPResourceFieldGridSelect .x-grid-item{
	background-color: #f3f3f4;
	padding: 0 /* 24px */ 0;
	margin-bottom: 1px;
	line-height: 1.1em;
}

.cssXPDataGrid .x-grid-item .x-grid-cell-first,
.cssXPResourceFieldGridSelect .x-grid-item .x-grid-cell-first {
	padding-left: 16px /* Fixed padding 8px */;
}

.cssXPDataGrid .x-grid-item .x-grid-cell-last,
.cssXPResourceFieldGridSelect .x-grid-item .x-grid-cell-last {
	padding-right: 16px;
}


.cssXPDataGrid .x-grid-item-over,
.cssXPDataGrid .x-grid-item-selected,
.cssXPResourceFieldGridSelect .x-grid-item-over,
.cssXPResourceFieldGridSelect .x-grid-item-selected{
	background-color: #ebebec;
}

.cssXPDataGrid a .x-autocontainer-innerCt{
    overflow: hidden;
	text-overflow: ellipsis;
}
.cssXPDataGrid .wt-column-cell-type-image{
	padding: 0;
}
.cssXPDataGrid .wt-column-cell-type-image img{
	max-width: 24px;
}

.cssXPDataGrid.XAML-DataGrid-Flex-Images .wt-column-cell-type-image img{
	max-width: 100%;
}

/*------Data Grid Compact--------------*/

.cssXPDataGrid.XAML-datagrid-compact {
	/* margin: 16px 24px; */
	margin: 0 0 24px 0;
	width: auto !important;
	background-color: #ffffff;
	padding: 8px 8px;
	border-radius: 4px;
}

.cssXPDataGrid.XAML-datagrid-compact .x-column-header,
.cssXPDataGrid.XAML-datagrid-compact .x-grid-cell {
	padding: 8px 4px;
	font-size: 11px;
}

.cssXPDataGrid.XAML-datagrid-compact .x-grid-header-ct .x-column-header-first,
.cssXPDataGrid.XAML-datagrid-compact .x-grid-item .x-grid-cell-first { padding-left: 8px }

.cssXPDataGrid.XAML-datagrid-compact .x-grid-header-ct .x-column-header-last,
.cssXPDataGrid.XAML-datagrid-compact .x-grid-item .x-grid-cell-last { padding-right: 8px }


/*----------------- Grid ------------------*/
.XAML-info-grid-table,
.XAML-grid-info-table{
	margin: 0 0 24px 0;
	/* width: auto !important; */
	border-radius: 4px;
	background-color: #ffffff;
	padding: 24px 0 24px 24px; /* Убираем отбивку справа у грида, она будет внутри */
	overflow-x: auto;
}
.XAML-grid-info-table>table, .XAML-info-grid-table>table{
	border-right: 24px solid transparent; /* добавляем отбивку справа, чтобы грид был симметричным */
}
.XAML-info-grid-table>table>tbody>tr>td,
.XAML-grid-info-table>table>tbody>tr>td{
	vertical-align: middle;
	padding: 16px;
	background-color: #f3f3f4;
	border-bottom: 1px solid #ffffff;
}

/* 210746 Fix width to min-width */

.XAML-info-grid-table>table>tbody>tr>td:first-child,
.XAML-grid-info-table>table>tbody>tr>td:first-child{
	min-width: 192px;
}

/* 236851 Fix column width with pic */

.XAML-info-grid-table.first-pic>table>tbody>tr>td:first-child,
.XAML-grid-info-table.first-pic>table>tbody>tr>td:first-child{
	min-width: 50px;
}

.XAML-grid-info-table.small-padding >table>tbody>tr>td{
	padding: 4px;
}

.XAML-grid-info-table .cssXPButton { margin: 0px }

.XAML-question-table>table>tbody>tr>td{ vertical-align: top }

.XAML-info-grid-title-column,
.XAML-grid-label-name,
.XAML-label-grid-column-name{
	color: #969eb2;
	font-size: 14px;
	line-height: normal;
}

.XAML-label-desc {
	color: #969eb2;
	font-size: 14px;
	line-height: normal;
}

.XAML-grid-info-table-compact{
	overflow-y: auto;
    box-sizing: border-box;
    height: 100%;
}
.XAML-grid-info-table-compact>table>tbody>tr>td{
	vertical-align: middle;
	padding: 8px;
}
.XAML-grid-info-table-compact>table>tbody>tr>td:first-child{
	max-width: 50%;
}

.XAML-grid-object-title-container{
	margin-top: 0 /* 16px */;
	margin-bottom:  40px /* 16px */;
}
.XAML-grid-object-title-container .XAML-label-header-2,
.XAML-grid-object-title-container .XAML-label-header-3
{ margin-bottom: 0px }

.XAML-grid-object-title-container>table>tbody>tr>td{
	vertical-align: top;
}
.XAML-grid-object-title-container .XAML-stack-image-container{
	width: 96px;
    height: 96px;
    background-size: cover !important;
    border-radius: 4px;
	margin-right: 24px;
}

.XAML-grid-object-title-desc-container {
	background-color: #313a4a;
	color: #FFFFFF;
    border-radius: 4px;
/* 	height: 288px; */
	overflow-y: hidden;
	margin: 0 0 24px 0;
}

.XAML-grid-object-title-desc-container .wtx-object-header-title{
	margin-top: 24px;
	max-width: calc(1176px - 800px);
	overflow: hidden;
}

.XAML-grid-object-title-desc-container>table>tbody>tr>td{
	vertical-align: top;
}
.XAML-grid-object-title-desc-container>table>tbody>tr>td:last-child{
	padding: 0 40px;
}
.XAML-grid-object-title-desc-container .XAML-stack-image-container{
	width: 720px;
    height: 100%;
    background-size: cover !important;
	height: 288px;
}
.XAML-label-title-desc{
	margin: 8px 0;
}

.XAML-grid-content-hor-container>table>tbody>tr>td{
	padding-right: 24px;
	vertical-align: top !important;
}

.XAML-grid-content-hor-container>table>tbody>tr>td:last-child{
	padding-right: 0;
}

.XAML-grid-list-container,
.XAML-stack-list-container{
	margin: 0 0 24px 0;
	background-color: #ffffff;
	border-radius: 4px;
	padding: 24px 24px;
}
.XAML-grid-list-item {
	background-color: #f3f3f4;
	padding: 0 0 /* 16px */;
	margin-bottom: 1px;
}
.XAML-grid-list-item:hover{
	background-color: #ebebec;
}
.XAML-grid-list-item>table>tbody>tr>td{
	padding: 16px 8px;
}
.XAML-tileview-list .XAML-grid-list-item>table>tbody>tr>td:first-child { padding-left: 16px }
.XAML-tileview-list .XAML-grid-list-item>table>tbody>tr>td:last-child { padding-right: 16px }

.XAML-grid-list-container .XAML-grid-list-item>table>tbody>tr>td:first-child { padding-left: 16px }
.XAML-grid-list-container .XAML-grid-list-item>table>tbody>tr>td:last-child { padding-right: 16px }

.XAML-grid-list-item td{
	vertical-align: top;
}

.XAML-image-list-image{
	width: 32px !important;
	height: 32px !important;
    background-size: cover !important;
	border-radius: 2px;
}
.XAML-label-list-item-label{
	font-size: 14px;
}
.XAML-label-list-item-desc{
	font-size: 14px;
	color: #969eb2;
}

.XAML-grid-table{
	background-color: #ffffff;
	border-radius: 4px;
	padding: 16px 16px;
	margin: 0 0 24px 0;
}
.XAML-grid-table>table>tbody>tr>td{
	background-color: #f3f3f4;
	padding: 8px 24px;
	border-bottom: 2px solid #ffffff;
}
.XAML-grid-table>table>tbody>tr:hover>td{
	background-color: #ebebec;
}
.XAML-grid-table .XAML-gridrow-header{
	font-size: 13px;
	color: #969eb2;
}
.XAML-grid-table .XAML-gridrow-header td{
	border-bottom: 4px solid #ffffff;
}

.XAML-grid-photos-container>table>tbody>tr>td{
	vertical-align: top;
	text-align: center;
}

.XAML-gridrow-multiline>td{
	vertical-align: top !important;
}

.XAML-grid-block-header-container>table>tbody>tr>td:last-child{
	text-align: right;
	vertical-align: bottom;
	font-size: 14px;
}
.XAML-grid-block-header-container>table>tbody>tr>td:last-child .cssXPLink{
	display: block;
	margin: 8px 0;
}


/*------ Compaund Data Grid -----*/

.XAML-compound-grid .cssXPStackPanel { margin-bottom: 8px; }
.XAML-compound-grid .cssXPStackPanel .cssXPStackPanel { margin-bottom: 0px !important }

/* Library buttons styles */

.x-btn-group-default-framed { background-color: transparent; box-shadow: none; border: 0px solid transparent; border-color: transparent; }
.wt-column-group-button-cls-playbtn, .wt-column-group-button-cls-downloadbtn { border: 1px solid #4176ea; padding: calc(8px + 2px) 16px; border-radius: 4px; cursor: pointer; }
.wt-column-group-button-cls-playbtn .x-btn-inner, .wt-column-group-button-cls-playbtn .x-btn-wrap, .wt-column-group-button-cls-downloadbtn .x-btn-inner, .wt-column-group-button-cls-downloadbtn .x-btn-wrap { display: none }
.wt-column-group-button-cls-playbtn:after { content: "\f04b"; font: normal normal 14px "icomoon"; }
.wt-column-group-button-cls-downloadbtn:after { content: "\f019"; font: normal normal 14px "icomoon"; }
.wt-column-group-button-cls-playbtn:hover, .wt-column-group-button-cls-downloadbtn:hover { background-color: #4176ea; color: #FFF }

/*------------ view_message_box.xaml ---------------*/

.XAML-grid-message-panel  {
	border-radius: 	4px;
	padding: 8px 8px;
	margin: 0 0 24px 0;
	color: #ffffff;
	font-size: 14px;
}
.XAML-grid-message-panel.XAML-grid-warning-panel{
	background-color: #ffac3e;
}
.XAML-grid-message-panel.XAML-grid-info-panel{
	background-color: #00a8ff;
}
.XAML-grid-message-panel.XAML-grid-error-panel{
	background-color: #ff606f;
}
.XAML-grid-message-panel .XAML-link-right-switch-collapsed{
	display: block;
	width: 16px !important;
	height: 16px;
	background: url(design/default/images/panel-arrow.png) -16px center no-repeat;
}

.XAML-grid-message-panel .XAML-link-right-switch-expanded{
	display: block;
	width: 16px !important;
	height: 16px;
	background: url(design/default/images/panel-arrow.png) -64px center no-repeat;
}
.XAML-grid-message-panel .cssXPButton {
	border: 0;
	color: #ffffff;
	padding: calc(4px + 2px) 8px;
	font-size: 14px;
	margin: 0;
}

.XAML-grid-message-panel .cssXPButton:hover{ background-color: #00298f; } /*#8bb2ff; */

.XAML-grid-message-panel.XAML-grid-warning-panel .cssXPButton { background-color: #dd9a42 /* #ffac3e */; }

.XAML-grid-message-panel .XAML-button-close{
	display: block;
	width: 16px !important;
	height: 16px;
	background: url(design/default/images/close.png) -16px center no-repeat;
	margin: 8px;
}

.XAML-grid-message-panel .XAML-button-close .x-btn-icon-el:before{
	content: "" !important;
}

.XAML-grid-message-panel a { color: #FFFFFF; text-decoration: underline; }

.XAML-image-message-icon{
	display: block;
	width: 16px !important;
	height: 16px !important;
	border: none;
	background-image: url(design/default/images/info.png);
	background-position: top left;
	background-repeat: no-repeat;
	margin: 8px;

}
.XAML-msgbox-img-info {
	background-image: url(design/default/images/info.png);
	background-position: top left;
	background-repeat: no-repeat;
}
.XAML-msgbox-img-error {
	background-image: url(design/default/images/info.png);
	background-position: top left;
	background-repeat: no-repeat;
}
.XAML-msgbox-img-warning {
	background-image: url(design/default/images/info.png);
	background-position: top left;
	background-repeat: no-repeat;
}
/*----------------- StackPanel ------------------*/

.XAML-stack-filters-container{
	padding: 0;
	border: 1px solid #c9ccd4;
	border-radius: 4px;
	/* margin-bottom: 8px; */
	margin: 0 0 24px 0;
}

.XAML-stack-filters-container.XAML-stack-filters-container-small{
	margin: 0 0 16px 0;
}

.XAML-uni-content-block .XAML-stack-filters-container{
	border-radius: 0;
	margin: 0;
	border: 0;
	border-bottom: 1px solid #ebebec;
}

.XAML-uni-content-block .spxmltileview { margin-top: 16px; margin-left: 0px !important; width: 100% !important }

.XAML-uni-content-block .XAML-course-map,
.XAML-uni-content-container .XAML-course-map,
.XAML-uni-content-block .XAML-grid-list-container,
.XAML-uni-content-container .XAML-grid-list-container{
	margin: 0px
}

.XAML-grid-filter>table>tbody>tr>td,
.XAML-stack-filter>table>tbody>tr>td{
	padding: 0 2px;
}
.XAML-grid-filter>table>tbody>tr>td:first-child,
.XAML-stack-filter>table>tbody>tr>td:first-child{
	padding-left: 24px;
}
.XAML-grid-filter>table>tbody>tr>td:last-child,
.XAML-stack-filter>table>tbody>tr>td:last-child{
	padding-right: 24px;
}

.XAML-stack-filter .cssXPComboBox,
.XAML-grid-filter .cssXPComboBox{
	font-size: 14px;
}

.XAML-grid-filter .XAML-button-action,
.XAML-stack-filter .XAML-button-action{
	border: 0;
	font-size: 14px;
	color: #4176ea;
	padding: 16px 8px;
	border-radius: 0;
	margin: 0;
}
.XAML-grid-filter .XAML-button-action:hover,
.XAML-stack-filter .XAML-button-action:hover{
	background-color: inherit;
	color: #4176ea;
}
.XAML-grid-filter .XAML-button-action.x-btn-icon-el:before,
.XAML-stack-filter .XAML-button-action .x-btn-icon-el:before{
	margin-right: 4px;
}

.XAML-stack-filter .cssXPEdit input,
.XAML-grid-filter .cssXPEdit input{
	padding: 4px;
	font-size: 14px;
}

.XAML-grid-filter .XAML-button-selector { border: 0px solid transparent; padding: 0px 0px 0px 0px ; }
.XAML-grid-filter .XAML-button-selector.icon-close { padding: 0px 8px 0px 0px ; }
.XAML-grid-filter .XAML-button-selector:hover { color: #4176ea }

.XAML-grid-filter-content,
.XAML-grid-filter-content-with-labels{
	padding: 24px 24px 8px 24px;
	/* border-bottom: 1px solid #c9ccd4; */
	border-top: 1px solid #c9ccd4;
}
.XAML-grid-filter-content>table>tbody>tr>td,
.XAML-grid-filter-content-with-labels>table>tbody>tr>td{
	padding: 0 16px 16px 16px;
}
.XAML-grid-filter-content>table>tbody>tr>td:last-child,
.XAML-grid-filter-content-with-labels>table>tbody>tr>td:last-child{
	padding-right: 0;
}
.XAML-grid-filter-content>table>tbody>tr>td:first-child,
.XAML-grid-filter-content-with-labels>table>tbody>tr>td:first-child{
	padding-left: 0;
}
.XAML-grid-filter-content input{
	/* font-size: 14px; */
}

.XAML-stack-content-header,
.content-header{
	border-bottom: 1px solid #ebebec;
	padding: 16px 24px;
}
.content-footer{
	padding: 16px;
	text-align: center;
	border-top: 1px solid #ebebec;
	clear: both;
}

.XAML-wrap-container
{
	white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
	white-space: -webkit-pre-wrap; /*Chrome & Safari */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	white-space: pre-wrap;       /* css-3 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
	word-break: break-all;
	white-space: normal;
}

.x-tool-img.x-tool-expand-bottom { background-image: url(design/default/images/panel_fat_icons.png); background-position: left top; }
.x-tool-img.x-tool-collapse-top { background-image: url(design/default/images/panel_fat_icons.png); background-position: right top; }

/* .wt-plain-stack .cssXPButton { margin: 0 0 16px 16px; } */

/* Отбивка у кнопок в плане обучения */
.XAML-grid-list-item .wt-plain-stack .cssXPButton { margin: 0 16px 16px 0; }

/*-------------  Blocks (Блоки) --------------*/
.XAML-uni-block,
.XAML-stack-block,
.info-block{
	margin: 0 0 24px 0;
	overflow: auto;
	box-sizing: border-box;
}
.XAML-stack-description{
	margin: 0 0 24px 0;
	border-radius: 4px;
	background-color: #ffffff;
	padding: 24px;
	display: inline-block;
	min-width: 100%;
}

/*--------------- Toolbar ----------------*/

 .cssXPToolbar .x-toolbar-item{
	margin-right: 8px;
}

.XAML-toolbar-actions, .XAML-toolbar {
		margin: 0 0 40px 0 !important;
}

.cssXPToolbar {
		margin: 0 0 24px 0 !important;
}

.XAML-toolbar-actions a.x-btn, .XAML-toolbar a.x-btn, .cssXPToolbar a.x-btn { top: 0 !important; }
.XAML-toolbar-actions div.cssXPComboBox, .XAML-toolbar div.cssXPComboBox, .cssXPToolbar div.cssXPComboBox { top: 0 !important; }

.XAML-Toolbar-btn-icons .x-btn-icon-el-default-toolbar-small {
    display: inline-block;
    font: normal normal normal 14px "icomoon";
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    max-height: 16px;
}

.XAML-Toolbar-btn-icons .x-btn-inner.x-btn-inner-default-toolbar-small { display: none }

/*--------------- Label ----------------*/
.XAML-label-divider{
	width: 1px;
	height: 16px;
	background: url(design/default/images/buttons-divider.png) center center no-repeat;
}
.XAML-label-divider-small{
	width: 1px;
	height: 16px;
	background: url(design/default/images/buttons-divider-small.png) center center no-repeat;
}
.XAML-label-filter-label{
	color: #969eb2;
	/* margin: 4px 0; */
	font-size: 13px;
}
/*--------------- Calendar ----------------*/
.cssXPCalendar {
	padding: 24px /* 16px 24px */;
	border-radius: 4px;
	background-color: #ffffff;
	box-sizing: border-box;
}

/* .CalendarPadding { border: 16px solid #FFF }  Project Calendar padding */
/* .CalendarPadding .cssXPCalendar { padding: 0px }  Project Calendar padding */

/* .cssXPCalendar>.x-panel-body{
	margin: 8px 24px;
	box-sizing: border-box;
	width: 100% !important;
} */
.cssXPCalendar .x-toolbar-item>table>tbody>tr>td{
	padding-right: 8px;
}
.cssXPCalendar .x-btn-default-toolbar-small{
	color: #969eb2;
	padding-top: 16px;
	padding-bottom: 18px; /* Добавляем к педдингу ширину подчеркивания активного элемента (нижней границы)*/
	padding-left: 8px;
	padding-right: 8px;

}
.cssXPCalendar .x-btn-default-toolbar-small.x-btn-pressed{
	color: #4176ea;
	border-bottom: 2px solid #4176ea;
	padding-bottom: 16px;
}
.cssXPCalendar .spxmlcalendarperiodmode .x-form-text-field-body-default{
	min-width: 90px;
}
.cssXPCalendar .spxmlcalendarmonth .x-form-text-field-body-default{
	min-width: 100px;
}

.cssXPCalendar .spxmlcalendarmonth .x-form-text-field-body-default{
	min-width: 100px;
}
.cssXPCalendar .spxmlcalendaryear .x-form-text-field-body-default{
	min-width: 75px;
}
.cssXPCalendar .wt-calendar-month-container-table,
.cssXPCalendar .wt-calendar-week-container-table,
.cssXPCalendar .wt-calendar-day-container-table{
	/* border-spacing: 1px; */
	border-collapse: collapse;
    /* border: 0; */
}

.cssXPCalendar .wt-calendar-header-cell{
	border-left: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
}
.cssXPCalendar .wt-calendar-header-row .wt-calendar-header-cell:first-child{
	border-left-width: 0;
}
.cssXPCalendar .wt-calendar-header-row .wt-calendar-header-cell:last-child{
	border-right-width: 0;
}
.cssXPCalendar .wt-calendar-cell{
	border: 1px solid #ffffff;
}
.cssXPCalendar .wt-calendar-row .wt-calendar-cell:first-child{
	border-left-width: 0;
}
.cssXPCalendar .wt-calendar-row .wt-calendar-cell:last-child{
	border-right-width: 0;
}

.cssXPCalendar .wt-calendar-month-cell-0,
.cssXPCalendar .wt-calendar-month-cell-2,
.cssXPCalendar .wt-calendar-week-cell-0,
.cssXPCalendar .wt-calendar-week-cell-2,
.cssXPCalendar .wt-calendar-day-cell-0{
	background-color: #ebebec;
}
.cssXPCalendar .wt-calendar-month-cell-1,
.cssXPCalendar .wt-calendar-week-cell-1,
.cssXPCalendar .wt-calendar-day-cell-1,
.cssXPCalendar .wt-calendar-mcat-cell-1{
	background-color: #f3f3f4;
}
.cssXPCalendar .wt-calendar-month-cell-3
.cssXPCalendar .wt-calendar-week-cell-3{
	background-color: #969eb2;
}

.cssXPCalendar .wt-calendar-week-cell-0,
.cssXPCalendar .wt-calendar-week-cell-1,
.cssXPCalendar .wt-calendar-week-cell-2,
.cssXPCalendar .wt-calendar-week-cell-3{
	vertical-align: top;
}
.cssXPCalendar .wt-calendar-week-cell-0>div,
.cssXPCalendar .wt-calendar-week-cell-1>div,
.cssXPCalendar .wt-calendar-week-cell-2>div,
.cssXPCalendar .wt-calendar-week-cell-3>div{
	/* height: auto !important; */
}
.cssXPCalendar .wt-calendar-week-container { overflow-y: hidden }
.cssXPCalendar .wt-calendar-week-container nobr{
	white-space: normal;
}
.cssXPCalendar .x-calendar-current-month-day,
.cssXPCalendar .x-calendar-previous-month-day,
.cssXPCalendar .x-calendar-next-month-day,
.cssXPCalendar .x-calendar-now-day{
	padding: 8px 4px 4px 8px;
}

.cssXPCalendar .wt-calendar-month-header-cell-work,
.cssXPCalendar .wt-calendar-month-header-cell-holiday,
.cssXPCalendar .wt-calendar-week-header-cell-work,
.cssXPCalendar .wt-calendar-week-header-cell-holiday,
.cssXPCalendar .wt-calendar-mcat-header-cell-1{
	text-align: center;
	padding: 16px 0px;
	font-size: 14px;
	border-bottom: 4px solid #ffffff;
	font-weight: normal;
}
.cssXPCalendar .wt-calendar-month-header-cell-work,
.cssXPCalendar .wt-calendar-week-header-cell-work,
.cssXPCalendar .wt-calendar-mcat-header-cell-1{
	background-color: #f3f3f4;
}
.cssXPCalendar .wt-calendar-month-header-cell-holiday,
.cssXPCalendar .wt-calendar-week-header-cell-holiday,
.cssXPCalendar .wt-calendar-mcat-header-cell-1-wknd{
	background-color: #969eb2;
	color: #FFFFFF;
}

.cssXPCalendar .wt-calendar-mcat-container { height: 100% !important; }

.cssXPCalendar .wt-calendar-mcat-container>table>tbody>tr>td{
	vertical-align: top;
}
.cssXPCalendar .wt-calendar-mcat-header-cell-1{
	border-left-width: 1px !important;
}
.cssXPCalendar .wt-calendar-event{
	/* padding: 4px 8px; */
	/* margin: 2px 0;	 */
    /* height: auto !important; */
    /* width: auto !important; */
    /* position: relative !important; */
	/* display: inline-block; */
}
.cssXPCalendar .wt-calendar-event a,
.cssXPCalendar .wt-calendar-day-container-table a{
	font-size: 14px;
	/* color: #FFFFFF; */
	font-weight: normal;
	width: 100%;
    display: inline-block;
}
.cssXPCalendar .wt-calendar-month-row>td{
	overflow: hidden;
}

.cssXPCalendar .wt-calendar-month-row>td>div{
	/* height: auto !important; */
}
.cssXPCalendar .wt-calendar-day-container-table .wt-calendar-day-header-cell-1>div{
	border: 0 !important;
    /* margin: 2px; */
    /* padding: 4px; */
	/* height: auto !important; */
}
.cssXPCalendar .wt-calendar-day-cell-0{
	padding: 8px;
}

.cssXPCalendar .spxmlcalendardate input{
	border: 0;
    box-shadow: none;
	background-color: inherit;
	padding: 0;
	color: #969eb2;
}
.cssXPCalendar .x-toolbar-default{
	padding: 0 16px;
	margin-bottom: 8px;
	border-bottom: 1px solid #c9ccd4;
}

.cssXPCalendar .x-panel-body>.x-autocontainer-outerCt{
	/*margin: 0 4px;
	 box-sizing: border-box; */
}

.cssXPCalendar .spxmlcalendardate{
	background-color: #ffffff;
	border: 0;
}

.cssXPCalendar .spxmlcalendardate .x-form-item-body{
	padding: 8px;
	margin: 0 16px;
	display: block;
}
.cssXPCalendar .spxmlcalendardate .x-form-date-trigger{
	background: url(design/default/images/arrow-down.png) -24px center no-repeat;
}

.cssXPCalendar .spxmlcalendardate .x-form-text-field-body-default{
	min-width: 100px;
}

.spxmlcalendarleftdaystep .x-btn-inner,
.spxmlcalendarrightdaystep .x-btn-inner,
.spxmlcalendarleftstep .x-btn-inner,
.spxmlcalendarrightstep .x-btn-inner,
.spxmlcalendarrefresh .x-btn-inner{
	display: none;
}

.spxmlcalendarleftdaystep,
.spxmlcalendarleftstep{
	width: 16px;
	height: 16px;
	background: url(design/default/images/arrow-left-right.png) 0 center no-repeat;
}
.spxmlcalendarleftdaystep:hover,
.spxmlcalendarleftstep:hover{
	background-position: -16px;
}

.spxmlcalendarrightdaystep,
.spxmlcalendarrightstep {
	width: 16px;
	height: 16px;
	background: url(design/default/images/arrow-left-right.png) -32px center no-repeat;
}
.spxmlcalendarrightdaystep:hover,
.spxmlcalendarrightstep:hover{
	background-position: -48px;
}
.spxmlcalendarrefresh{
	width: 22px;
	height: 16px;
	background: url(design/default/images/refresh.png) 0 center no-repeat;
	margin-left: 16px;
	border: 0;
}
.spxmlcalendarrefresh:hover{
	background-position: -22px;
}
/*--------------- Buttons ----------------*/
.cssXPButton{
	border: 1px solid #4176ea;
	/* padding: 13px 23px; */
	font-size: 14px;
	padding: calc(8px + 2px) 16px;
	border-radius: 2px;
	color: #4176ea;
	cursor: pointer;
	margin: 0 0 16px 0;
}
.cssXPButton:hover,
.cssXPButton.x-btn-pressed{
	/* border-color: #355bbb;
	color: #355bbb; */

	border-color: #4176ea;
	background-color: #4176ea;
	color: #FFFFFF;
}
.cssXPButton.x-btn-disabled{
	border: 1px solid #adb1b9;
	color: #adb1b9;
	cursor: default;
}
.cssXPButton.x-btn-disabled:hover{
	background-color: inherit;
}
.XAML-button-important{
	background-color: #4176ea;
	color: #FFFFFF;
}
.XAML-button-important.x-btn-disabled{
	border: 1px solid #c9ccd4;
	background-color: #c9ccd4;
	color: #FFFFFF;
	cursor: default;
}
.XAML-button-important:hover{
	color: #FFFFFF;
	background-color: #355bbb;
	border: 1px solid #355bbb;
}
.XAML-button-view{
	border: 0;
	font-size: 14px;
	color: #969eb2;
	padding: 16px 8px;
	border-radius: 0;
	margin: 0;
	border-top: 2px solid transparent;
	border-bottom: 2px solid transparent;
}
/* .XAML-button-view, .XAML-button-view:hover{
	padding: 8px;
	border: 0;
	font-size: 14px;
} */
.XAML-button-view.x-btn-pressed,
.XAML-button-view:hover,
.XAML-button-view:active{
	border-top-color: transparent;
	color: #4176ea;
	border-bottom: 2px solid transparent;
	background-color: inherit;
}
.XAML-button-view.x-btn-pressed{
	border-bottom: 2px solid #4176ea;
}
.XAML-button-view.x-btn-pressed:active{
	border-bottom: 2px solid transparent;
}
.XAML-button-view .x-btn-icon-el-default-small{
	/* margin-right: 4px; */
}
.XAML-button-view .x-btn-button-default-small{
	line-height: normal;
}
.XAML-button-tab{
	color: #313a4a;
	padding: 16px 0;
	margin-right: 8px;
}
.XAML-button-content{
	border-color: #969eb2;
	background-color: #969eb2;
	/*padding: 8px 16px;*/
	color: #FFFFFF;
}
.XAML-button-content:hover{
	border-color: #727a8d;
	background-color: #727a8d;
	color: #FFFFFF;
}
.XAML-button-content.x-btn-disabled{
	color: #FFFFFF;
}
.XAML-button-content.x-btn-disabled:hover{
	border-color: #969eb2;
	background-color: #969eb2;
}
.XAML-button-selector, .XAML-button-activate {
	border: 1px solid #c9ccd4;
	background-color: inherit;
	padding: calc(8px + 2px);
	color: #969eb2;
	margin: 8px 0px 8px 4px;
}

.XAML-button-selector:hover{
	border-color: #727a8d;
	background-color: inherit;
	color: #727a8d;
}

.XAML-button-filter-date { margin-top: 16px; padding: 8px  16px  }

.x-btn-no-text .x-btn-inner.x-btn-inner-default-small{
	display: none;
}

.cssXPResourceFieldButton { height: 40px; min-width: 40px !important; border: 1px solid #c9ccd4; box-shadow: inset 0 0 3px #cccccc; margin-left: 10px; border-radius: 2px; font-weight: bold; }

.x-btn-inner-default-toolbar-small { line-height: 1.2em } /* Убираем обрезание букв в IE */


/*--------------- ComboBox ----------------*/
.x-form-trigger-default{
	width: 8px;
}
.cssXPComboBox input{
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	background-color: transparent;
	padding-right: 8px;
	border: 0;
}

.cssXPComboBox input:focus { border: 0px solid transparent }

.cssXPComboBox .x-form-trigger-wrap-default{
	border: 1px solid #c9ccd4;
	border-radius: 2px;
	background-color: #ffffff;
	box-shadow: inset 0 1px 3px #DDDDDD;
	padding: calc(8px + 2px) 16px ;
    cursor: pointer;
    cursor: hand;
}
.cssXPComboBox .x-form-arrow-trigger
{
	background: url(design/default/images/arrow-down.png) -24px center no-repeat;
	/* margin-right: 16px; */
}

.cssXPComboBox input{
	padding: 0;
    cursor: pointer;
    cursor: hand;
}


.cssXPComboBoxComboPane.x-boundlist,
.cssXPComboBoxComboPane.x-boundlist-floating.x-boundlist-above{
	border: 1px solid #c9ccd4;
	background-color: #ffffff;
	border-radius: 2px;
}

.cssXPComboBox .x-pickerfield-open .x-form-trigger-wrap-default{
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.cssXPComboBoxComboPane.x-boundlist-floating{
	border-top-width: 0;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.cssXPComboBoxComboPane li{
	padding: 8px 16px;
}

.x-css-shadow{
	display: none;
}

.XAML-combo-menu-button{
}
.XAML-combo-menu-button .x-form-trigger-wrap-default{
	border: 1px solid #4176ea;
	border-radius: 2px;
	background-color: inherit;
	-moz-box-shadow:    none;
	-webkit-box-shadow: none;
	box-shadow:         none;
	/* padding: 8px 16px;
	padding-top: 8px;
	padding-bottom: 8px;*/
	color: #4176ea;
	/* padding: 8px 8px 8px 16px ; */
}
.XAML-combo-menu-button .x-form-arrow-trigger
{
	background: url(design/default/images/arrow-down.png) 0 center no-repeat;
	margin-right: 16px;
}
.XAML-combo-menu-button .x-form-text-wrap{
	line-height: 0;
}

.XAML-combo-menu-button input{
	box-shadow: none;
	font-size: 14px;
	color: #4176ea;
	cursor: pointer;

	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.XAML-combo-menu-button .x-form-trigger-wrap-default:hover,
.XAML-combo-menu-button .x-form-trigger-wrap-default:hover input,
.XAML-combo-menu-button .x-pickerfield-open .x-form-trigger-wrap-default,
.XAML-combo-menu-button .x-pickerfield-open .x-form-trigger-wrap-default input{
	color: #355bbb;
	border-color: #355bbb;
}
.XAML-combo-menu-button .x-form-trigger-wrap-default:hover .x-form-arrow-trigger{
	background-position-x: -8px;
}


.XAML-combo-menu-buttonComboPane.x-boundlist,
.XAML-combo-menu-buttonComboPane.x-boundlist-floating.x-boundlist-above{
	border-color: #355bbb;
	background-color: #f3f3f4;
	border-top: 0;
}
.XAML-combo-menu-buttonComboPane.x-boundlist li{
	padding: 8px 16px;
	color: #355bbb;
}

.XAML-combo-view{
	margin-top: 8px;
	margin-bottom: 8px;
}
.XAML-combo-view .x-form-trigger-wrap-default{
	border: 0;
    box-shadow: none;
	padding: 8px;
	color: #969eb2;
	border: 1px solid transparent;
	background-color: inherit;
	-webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */;
}

.XAML-combo-view .x-pickerfield-open .x-form-trigger-wrap-default{
	border: 1px solid #c9ccd4;
	color: #313a4a;
	/* background-color: #ffffff; */
}
.XAML-combo-view input{
	font-size: 14px;
	color: inherit;
}
.XAML-combo-viewComboPane li{
	padding: 8px 8px;
	background-color: #f3f3f4;
	font-size: 14px;
}
/*--------------- Edit ----------------*/
.cssXPEdit.x-field-focus{
	/*
   -moz-box-shadow:     0 0 3px #4176ea;
   -webkit-box-shadow:  0 0 3px #4176ea;
   box-shadow:          0 0 3px #4176ea;
   */
}
/*--------------- CheckBox ----------------*/
.cssXPCheckBox input{
	border: 0;
	padding: 0;
	-moz-box-shadow:    none;
	-webkit-box-shadow: none;
	box-shadow:         none;
	margin: 5px 0;
}

/*--------------- Radio ----------------*/
input.x-form-radio, input.x-form-radio:hover{
	border: 0;
	padding: 0;
	background-color: inherit;
	-moz-box-shadow:    none;
	-webkit-box-shadow: none;
	box-shadow:         none;
}
/*------------- DatePicker --------------*/
.cssXPDatePicker input{
	border: 0;
    box-shadow: none;
	background-color: inherit;
	padding: 0;
}
.cssXPDatePicker{
	background-color: #ffffff;
	border: 1px solid #c9ccd4;
    box-shadow: inset 0 0 3px #cccccc;
}

.cssXPDatePicker .x-form-item-body{
   padding: 8px;
}
.cssXPDatePicker .x-form-date-trigger{
	background: url(design/default/images/arrow-down.png) -24px center no-repeat;
}

/*--------------- Dialog ----------------*/

.x-window-body-default {
		font-size: 15px;
}

.cssXP-Dialog-Window .cssXPSPXMLScreen.x-fit-item { padding: 16px; }

.cssXP-Dialog-Window .cssXPSPXMLScreen.x-fit-item .XAML-grid-object-title-container { margin-bottom: 16px; }

.cssXP-Dialog-Window .cssXPTabControl-top>.x-tab-bar-horizontal>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default { padding-top: 0px }

.cssXP-Dialog-Window .cssXPTabControl-top .x-tab-bar { margin-bottom:  16px; padding-left: 0px; }

.cssXP-Dialog-Window .XAML-grid-info-table { border: 1px solid #c9ccd4; border-radius: 4px; padding: 8px;  }
.cssXP-Dialog-Window .cssXPDataGrid {  border: 1px solid #c9ccd4; border-radius: 4px; padding: 8px; }


.cssXP-Dialog-Window .XAML-grid-dialog-buttons { border: 0px solid transparent; padding: 0px; }
.cssXP-Dialog-Window .XAML-grid-dialog-buttons .cssXPButton { margin: 0px }

.cssXP-Dialog-Window .XAML-info-grid-table, .cssXP-Dialog-Window .XAML-grid-info-table { margin: 0 0 16px 0; }

.cssXP-Dialog-Window .XAML-grid-info-table>table, .cssXP-Dialog-Window .XAML-info-grid-table>table{
	border-right: 0px solid transparent; /* добавляем отбивку справа, чтобы грид был симметричным */
}

.cssXP-Dialog-Window,
.x-window-ghost,
.cssXPResourceFieldDialog {
	background-color: #ffffff;
	/* border: 1px solid #c9ccd4; */
	border-radius: 4px;
	/* width: 80% !important; */
}
.cssXP-Dialog-Window .x-window-header,
.x-window-ghost .x-window-header,
.cssXPResourceFieldDialog .x-window-header {
	padding: 16px;
	/* background-color: #ebebec; */
	border-bottom: 1px solid #c9ccd4;
	max-width: 100%;
}
.cssXP-Dialog-Window .x-window-header .x-title-text,
.x-window-ghost .x-window-header .x-title-text,
.cssXPResourceFieldDialog .x-window-header .x-title-text{
	font-size: 17px;
	text-align: center;
}
.x-tool-close{
	display: block;
	width: 16px;
	height: 16px;
	background: url(design/default/images/close.png) 0 center no-repeat;
}
.x-tool { top: 2px !important }
.cssXP-Dialog-Window .cssXPToolbar {
	padding: 8px 16px;
/*	border-top: 1px solid #c9ccd4;
	border-bottom: 1px solid #c9ccd4;	*/
}

.XAML-grid-dialog-buttons{
	padding: 24px  24px  8px  24px;
	border-top: 1px solid #c9ccd4;
}
.XAML-grid-dialog-buttons>table>tbody>tr>td{
	padding-left: 4px;
	padding-right: 4px;
}
.XAML-grid-dialog-buttons>table>tbody>tr>td:first-child{
	padding-left: 0;
}
.XAML-grid-dialog-buttons>table>tbody>tr>td:last-child{
	padding-right: 0;
}
.cssXP-Dialog-Window .XAML-stack-filters-container{
	margin: 0 0 16px 0;
}

.cssXP-Dialog-Window .cssXPDataGrid{
	margin: 0;
	padding-top:  8px;
	padding-bottom: 8px;
}

div.cssXP-Dialog-Window div.cssXPSPXMLScreen div.cssXPDataGrid { margin-bottom: 16px; } /* 30085 */

.cssXP-Dialog-Window .cssXPDataGrid .x-grid-header-ct{
	margin: 4px 0;
}
.cssXP-Dialog-Window .cssXPDataGrid .x-grid-cell {
	padding: 16px 8px;
}

.cssXP-Dialog-Window .cssXPDataGrid .x-grid-cell-first { padding-left: 16px }
.cssXP-Dialog-Window .cssXPDataGrid .x-grid-cell-last { padding-right: 16px }

.cssXP-Dialog-Window .cssXPDataGrid .x-column-header, .cssXPResourceFieldGridSelect .x-column-header{
	padding: 16px 4px;
}

.cssXP-Dialog-Window .cssXPDataGrid .x-column-header-first, .cssXPResourceFieldGridSelect .x-column-header-first {
	padding-left: 16px;
}

.cssXP-Dialog-Window .cssXPDataGrid .x-column-header-last, .cssXPResourceFieldGridSelect .x-column-header-last {
	padding-right: 16px;
}

.cssXP-Dialog-Window .cssXPDataGrid .x-grid-item-selected .x-grid-cell { background-color: #cccccc !important }

.cssXP-Dialog-Window .XAML-grid-filter>table>tbody>tr>td:last-child, .XAML-stack-filter>table>tbody>tr>td:last-child .cssXP-Dialog-Window { padding-right: 16px; }

.cssXP-Dialog-Window .XAML-uni-content-block { margin: 0 0 16px 0; }

.XAML-dialog-edit-text { margin: 0 0 16px 0; }

/*----------------Dialog Select------------*/
/*----Уменьшаем шрифт и отбивку только в dlg_select, для удобства работы с большими списками----*/

.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .XAML-stack-filters-container { margin-bottom: 0px }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item { padding: 0px }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item.XAML-grid-info-table { border: 0px solid #c9ccd4; border-radius: 0px; padding: 16px;  }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .cssXPDataGrid {  border: 0px solid #c9ccd4; border-radius: 0px; padding: 0 16px 8px 16px; }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .XAML-uni-content-block { margin: 0 0; }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .cssXPToolbar { margin-bottom: 0 !important; }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .cssXPDataGrid .x-grid-cell { padding: 8px 8px; }
.cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .cssXPDataGrid .x-column-header, .cssXP-Dialog-Window .cssXPSPXMLScreen.dlg_select.x-fit-item .cssXPResourceFieldGridSelect .x-column-header { padding: 8px 8px; }

.cssXP-Dialog-Window .dlg_select .cssXPToolbar {
	padding: 0px 16px;
	border-top: 0px solid #c9ccd4;
	border-bottom: 0px solid #c9ccd4;
}
.cssXP-Dialog-Window .dlg_select .cssXPDataGrid  {
	padding: 8px  16px;
}

.cssXP-Dialog-Window .dlg_select .XAML-grid-dialog-buttons {
		padding: 0px 16px 16px 16px;
		border-top:  0px solid #c9ccd4;
}

.cssXP-Dialog-Window .dlg_select .x-grid-view {
	overflow-x: hidden !important;
}

.cssXP-Dialog-Window .XAML-grid-info-table>table>tbody>tr>td { /* padding: 0 16px; */ }

body.mode-game .cssXP-Dialog-Window .XAML-stack-list-container { padding: 0px !important; }
body.mode-game .cssXP-Dialog-Window .XAML-stack-list-container .XAML-stack-description { padding: 0px !important; }

/* Корректировка CSS для XAML DLG Select */

.ui-dialog .ui-dialog-content { padding: 0.5em 0.5em !important }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPDataGrid { margin: 0 0 8px 0 !important; padding: 0px !important }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPDataGrid .x-grid-view.x-grid-with-row-lines.x-fit-item { overflow-x: hidden !important; border-bottom: 8px solid #FFF; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar { margin-bottom: 0 !important; }
.x-container.cssXPSPXMLScreen.dlg_select .XAML-uni-content-header { margin-bottom: 8px !important }
.x-container.cssXPSPXMLScreen.dlg_select .XAML-grid-dialog-buttons { padding: 8px !important }

/*------------ MessageBox -------------*/
.x-message-box{
	background-color: #ffffff;
	border-radius: 4px;
	padding: 0 /* 16px */;
	max-width: 100%;
	box-sizing: border-box;
}

.x-message-box .x-window-header-default {
	background-color: #FFFFFF;
	border-color: #FFFFFF;

}

.x-message-box .x-window-header{
	/* padding: 24px 24px 0 24px; */
	padding: 24px;
	box-sizing: border-box;
}

.x-message-box .x-window-body { padding: 0 24px 24px 24px; }

.x-message-box .x-toolbar-footer { padding: 0px 24px 24px 24px }

.x-message-box .x-btn
{
	background-color: #4176ea;
	color: #FFFFFF;
	padding: 8px 16px;
	border-radius: 2px;
}
.x-mask{
	background-color: rgba(142, 142, 143, 0.6);
}

/*---------------- Panel --------------*/
.cssXPPanel{
	margin: 0 0 16px 0;
}
.cssXPPanel .x-panel-header{
	font-size: 17px;
	padding-bottom: 8px;

}
.cssXPPanel .x-panel-body{
    padding: /* 8px 0 */ 0 0 0 /* 8px */ 0;
    border-radius: 4px;
}

.x-panel-header-title-default {
	margin: 0 0 16px 0;
	top: 0px !important;
}

/*---------------- Tree --------------*/
.x-tree-elbow-plus,
.x-tree-elbow-end-plus
{
	background-image: url(design/default/images/plus.png);
}
.x-grid-tree-node-expanded .x-tree-elbow-plus,
.x-grid-tree-node-expanded .x-tree-elbow-end-plus{
	background-image: url(design/default/images/minus.png);
}
.x-tree-elbow-end{
	background-image: url(design/default/images/buttons-divider.png);
	background-position-x: center;
}
.x-tree-lines .x-tree-elbow-end, .x-tree-lines .x-tree-elbow-empty, .x-grid-cell-treecolumn .x-tree-elbow-end { background-image: none }

.x-tree-icon-parent{
	margin-left: 4px;
}

.cssXPTree {
	margin: 0 0 24px;
}

.cssXPTree .x-tree-icon{
	display: none;
}
.x-tree-elbow-img{
	width: 8px;
    height: 1em;
	margin: 0 4px;
}
.cssXPTree .x-tree-view .x-grid-item-container{
	border: 1px solid #c9ccd4;
	border-radius: 4px;
}
.cssXPTree .x-tree-view .x-grid-item{
	font-size: 14px;
	border-bottom: 1px solid #c9ccd4;
	width: auto !important;
}
.cssXPTree .x-tree-view .x-grid-item:last-child{
	border-bottom-width: 0;
}
.cssXPTree .x-tree-view .x-grid-cell-inner-treecolumn{
	padding: 13px 8px;
	cursor: pointer;
	box-sizing: border-box;
/*	width: 210px; */
	text-overflow: ellipsis;
}

.cssXPTree .x-tree-view .x-grid-item-selected,
.cssXPTree .x-tree-view .x-grid-item-focused{
	color: #4176ea;
}

.cssXPTree .x-tree-view .x-grid-cell-inner-treecolumn{
	border-left: 1px solid transparent;
}
.cssXPTree .x-tree-view .x-grid-item-selected .x-grid-cell-inner-treecolumn{
	border-left: 1px solid #4176ea;
}
/*---------------- HTMLTip ---------------*/
.x-tip{
	background-color: #4176ea;
    padding: 4px 8px;
    border-radius: 2px;
    color: #FFFFFF;
    font-size: 13px;
}
/*---------------- Tile ---------------*/
.spxmltileview{
	padding: 0 !important;
	width: calc(100% + 24px) !important;
	margin-left: -24px;
}
.spxmltileview-tile{
	width: 216px;
	padding: 0 !important;
	/* width: auto !important; */
	overflow: hidden !important;
	/* min-height: 290px; */
	/* margin: 16px 24px 16px 0 !important; */
	margin: 0 24px 16px 24px;
}
.xaml-tileview-percentage-width-layout.spxmltileview  { width: 100% !important }
/* .xaml-tileview-fixed-width-layout.spxmltileview { width: 100%; margin-left: 0; } */
.xaml-tileview-percentage-width-layout { width: 100%; margin-left: 0 }
.xaml-tileview-percentage-width-layout .spxmltileview-tile { margin: 0; }

.XAML-tileview-gallery .spxmltileview-tile { height: auto !important; }

/* Кнопки пейджинга */
.cssXPTileView>.x-toolbar>.x-box-inner>.x-box-target>*,
.cssXPDataGrid>.x-toolbar>.x-box-inner>.x-box-target>*{
	left: auto !important;
    right: auto !important;
    top: auto !important;
    position: relative !important;
    vertical-align: middle;
    display: inline-block;
	margin-right: 8px !important;
}
.x-tbar-page-number{
	width: auto !important;
}
.x-tbar-page-number .x-form-text-field-body-default{
	min-width: auto;
}

.XAML-stack-tile{
	/* min-height: 216px; */
	/* margin: 16px 24px 16px 0 !important; */
	/* margin: 16px 12px !important; */
	/* margin: 10px 12px 10px 12px !important; */ /* Р­РўРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћРћ */
}

.XAML-tileview-list{
	background-color: #ffffff;
	padding: 24px 24px;
	border-radius: 4px;
	margin: 0 0 24px 0;
}
.XAML-tileview-list .spxmltileview-tile{
	float: none;
	height: auto !important;
	width: auto !important;
	margin: 0 !important;
}
.XAML-stack-tile-image-container{
	/* height: 160px !important; */
	border-radius: 4px;
	overflow: hidden;
}

.XAML-image-tile-image{
	display: block;
	/* height: 160px; */
	/* width: 192px; */
    background-size: cover !important;
	/* margin-bottom: 8px; */
	cursor: pointer;
}

.XAML-person-tile-image {
	display: inline-block;
	/* height: 160px; */
	/* width: 192px; */
    background-size: cover !important;
	/* margin-bottom: 8px; */
	cursor: pointer;
}

.XAML-link-tile-title, .XAML-label-tile-title {
	display: block;
	font-family:  'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 17px;
	color: #313a4a;
}
.XAML-stack-tile-title-container{
	margin: 16px 0;
	height: auto !important;
}
.XAML-link-tile-title:hover{
	color: #4176ea;
}
.XAML-label-tile-label{
	margin-bottom: 8px;
}
.XAML-label-tile-desc{
	color: #969eb2;
	font-size: 14px;
}

.XAML-image-tile-good {
	padding: 24px;
}


.XAML-label-status{
	display: inline-block;
    font-size: 14px;
    padding: 2px 4px;
    border-radius: 2px;
	white-space: nowrap;
	margin: 0 0 0 4px;
}
.XAML-label-tile-status{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 4px 2px 2px 2px;
	/* background-color: green; */
	z-index: 10;
	color: #ffffff;
	padding: 4px 8px;
	font-size: 13px;
}
.XAML-label-tile-image-caption{
	font-size: 14px;
	background-color: #313a4a;
	color: #FFFFFF;
	padding: 16px;
	text-align: center;
	/* border-radius: 0 0 4px 4px; */
}

.XAML-link-tile-info {
    position: absolute;
    right: 16px;
    top: 16px;
    display: block;
    z-index: 50;
	border: 1px solid #969eb2;
	border-radius: 2px;
	padding: 2px;
	background-color: #f3f3f4;
	color: #969eb2;
}
.XAML-link-tile-info:hover{
	color: #4176ea;
	border-color: #4176ea;
}
.XAML-tabitem-tile-info{
	color: #FFFFFF;
	background-color: #4176ea;
	border-radius: 4px;
	/* padding: 8px; */
}
.XAML-tabitem-tile-info .XAML-link-tile-info{
	color: #FFFFFF;
	border-color: #FFFFFF;
	background-color: inherit;
}
.XAML-tabitem-tile-info .XAML-grid-info-table-compact{
	/*margin-top: 16px;*/
	padding: /* 16px */ 8px 8px; /* Замена Normal на Small для корректного отображения тайла в панели руководителя */
}
.XAML-tabitem-tile-info .XAML-grid-info-table-compact>table>tbody>tr>td{
	padding: 0;
	font-size: 14px;
}
.XAML-tabitem-tile-info .XAML-label-grid-column-name{
	color: #8bb2ff;
}
.XAML-tabitem-tile-info .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td{
	border-bottom: 1px solid rgba(255, 255, 255, 0.20);
	padding-bottom: 8px;
}
.XAML-tabitem-tile-info .XAML-grid-info-table-compact>table>tbody>tr:nth-child(odd)>td{
	padding-top: 4px;
}

.x-accordion-body .XAML-grid-info-table-compact>table>tbody>tr>td{
	vertical-align: middle;
	padding: 4px;
}

/* Добавляем отбивку в тайловом представлении карточки сотрудника, чтобы иконка переключения типа представления не наезжала на текст */
.x-accordion-body .XAML-grid-info-table-compact tr:nth-child(1) td div { margin-right: 30px }
.x-accordion-body .XAML-grid-info-table-compact tr:nth-child(2) td div { margin-right: 30px }

.XAML-stack-tile-image .XAML-stack-tile-image-container { height: 270px; background-size: cover !important; }
.XAML-stack-tile-image .XAML-link-tile-title { position: absolute; left: 0px; bottom: 0px; width: 100% !important; background: rgba(255,255,255,0.85); padding: 8px !important; min-height: 76px; }
.XAML-stack-tile-image .XAML-label-tile-status { right: 0; width: auto; left: inherit; border-radius: 0px 4px 0px 8px; padding:  8px; }

.XAML-stack-tile-row { width: 100%; background-color: #FFFFFF; }
.XAML-stack-tile-row td { vertical-align: top }
.XAML-stack-tile-row .XAML-stack-tile-image-container { padding: 16px !important }
.XAML-link-hor-tile-title {  font-size: 24px; margin-bottom: 8px; display: block; }
.XAML-label-hor-tile-desc  {  font-size: 14px; margin-top: 8px; display: block; color: #969eb2; }

.XAML-label-hor-tile-status, .XAML-label-hor-tile-date, .XAML-label-hor-tile-score { padding-right: 2px }
.XAML-label-hor-tile-status-bold, .XAML-label-hor-tile-date-bold, .XAML-label-hor-tile-score-bold { font-weight: 500 }

/*------ News -------*/

.category_news .XAML-label-tile-date { position: absolute; margin-top: -150px; margin-left: 10px; background-color: #FFF; border-radius: 4px; padding: 4px; }
.XAML-news-container { overflow: hidden; }
.XAML-link-all { font-weight: normal;}
.news-block-container>table>tbody>tr:last-child>td { vertical-align: top }
.news-block-container>table>tbody>tr:last-child>td>.XAML-link-all { margin-top: 16px; }



/*----------------- Wiki ----------------*/

.cssXPPanel .XAML-grid-list-container  { margin: 0px }
.cssXPPanel .catalog_list .XAML-grid-list-container  { margin-bottom: 16px }

.cssXPTabControl .cssXPRichEdit { margin: 0px 0px 16px 0px }
.cssXPTabControl .cssXPRichEdit .cke_chrome { box-sizing: border-box; border: 1px solid #e0e0e0; }

.XAML-paging-container { margin: 0px 0px 16px 0px }
.XAML-paging-container .x-bnt-container { background-repeat: no-repeat; background-position: center center; }
.XAML-paging-container .x-tbar-page-btn { width: 40px !important; height: 40px; border-radius: 2px; border: 1px solid #c9ccd4; display: block; }


.XAML-paging-divider { padding: 0px 10px }

.XAML-ShowTree-Link { display: block; margin-bottom: 8px }

.XAML-Object-Title .x-title-text { font-weight: bold }
.XAML-Object-Title .x-header { margin-bottom: 0px }

.XAML-Wiki-Object-grid td { vertical-align: top }
.XAML-Wiki-Object-grid .cssXPButton { margin-left: 8px; }
.XAML-Wiki-Object-grid .XAML-Object-Edit input[type=text] { padding: calc(8px + 1px) !important }

.XAML-Wiki-CheckBox { padding-bottom: 8px; }

.XAML-Wiki-grid td { vertical-align: top; }

.Wiki-path { margin-bottom: 24px;  }
.Wiki-divider { width: 16px }
.Wiki-divider:after { font-size: 13px; content: " \00BB\00A0 "; width: 20px; padding-left: 4px; }
.path-parent  { color: #000000; font-size: 13px }
.Wiki-path>div>div>div:first-child .path-parent { color: #969eb2; }
.Wiki-article-panel .xaml-tileview-percentage-width-layout.spxmltileview { padding: 24px 24px 16px 24px !important; border-radius: 4px; background-color: #FFF; margin-bottom: 24px; box-sizing: border-box; }
.Wiki-article-panel .spxmltileview-tile { height: auto !important; }
.Wiki-article-panel .wt-spxmltileview-message-nodata { display: block; text-align: left; padding: 0px 0px 8px 0px; }
.Wiki-article-panel .XAML-label-empty-data { display: block; text-align: left; padding:  padding: 16px; margin: 0px 0px 16px 0px; background-color: #FFF; }

.Wiki-article-panel .cssXPStackPanel .wt-stack-wrap-cell .XAML-button { margin-right: 8px; }
.Wiki-article-panel .cssXPStackPanel .wt-stack-wrap-cell .XAML-stack-block { margin-bottom: 16px; }
.Wiki-article-panel .cssXPStackPanel .wt-stack-wrap-cell .XAML-stack-block  .cssXPComboBox { margin-right: 8px; margin-top: 1px; }

.Wiki-article-panel .XAML-stack-description .cssXPHTMLBox img { max-width: 100% !important; height: auto !important }

.Wiki-article-image { padding-left: 16px; }

.mode-wiki_base div.ui-dialog { width: 850px !important; border-radius: 2px !important; border: 1px solid #e0e0e0 !important; }
.mode-wiki_base div.ui-dialog-titlebar { border-bottom: 1px solid #e0e0e0 !important; }
.mode-wiki_base button.ui-dialog-titlebar-close { /*font-size: 0px !important; margin: 12px;*/ }

.XAML-Wiki-HTMLBox { overflow-y: auto; background-color: #FFFFFF; padding: 20px; border-radius: 2px; }

.XAML-questions-panel .XAML-button, .XAML-questions-panel .cssXPButton  { margin: 0px }
.XAML-questions-panel .cssXPCheckBox { padding-left: 8px }
.XAML-questions-panel .cssXPGrid td { padding-bottom: 8px }
.XAML-Wiki-dialog .XAML-info-grid-table { padding: 0px }
.XAML-wiki-dialog-grid td { padding-bottom: 8px }
.XAML-Wiki-dialog .XAML-wiki-dialog-grid .cssXPComboBox { padding-right: 8px }
.XAML-Wiki-dialog .Wiki-input { padding-right: 8px }

.XAML-Stack-Panel-Wiki-Gray { display: block; overflow: hidden; text-align: center; vertical-align:middle; width: 216px !important; height: 68px; max-height: 68px; font-size: 15px; background-color: #727a8d; color: #FFFFFF !important; padding: 16px; border-radius: 4px; margin-right: 24px; margin-bottom: 16px; }

.XAML-Stack-Panel-Wiki-Color { display: block; overflow: hidden; text-align: center; vertical-align:middle; width: 216px !important; height: 68px; max-height: 68px; font-size: 15px; background-color: #4176ea; color: #FFFFFF !important; padding: 16px; border-radius: 4px;  margin-right: 24px; margin-bottom: 16px;}
.XAML-stack-selector>table>tbody>tr>td { vertical-align: top; }
.XAML-stack-container.XAML-stack-selector .XAML-button-selector { margin: 0 0 0 4px; } /* Убираем сдвиг в резервировании оборудования #138227 */
.XAML-recommended-learning .XAML-grid-filter>table>tbody>tr>td:last-child, .XAML-recommended-learning .XAML-stack-filter>table>tbody>tr>td:last-child { padding-right: 0px }
.XAML-recommended-learning .XAML-grid-filter>table>tbody>tr>td:first-child, .XAML-recommended-learning .XAML-stack-filter>table>tbody>tr>td:first-child { padding-left: 0px }
.XAML-recommended-learning .XAML-stack-container { padding-bottom:  16px }
.XAML-recommended-learning .XAML-stack-filter .cssXPEdit input { height: 40px !important; padding: 0px 8px;  }


/*--------------- Разное --------------*/

.XAML-person-tile { padding: 0 0 24px 0 }

.XAML-info-icon { width: 16px !important; height: 16px !important; background-image: url(/design/default/images/info_black.png) !important; background-repeat: no-repeat !important; background-position: top left !important; cursor: pointer; }

.XAML-info-block { background-color: #FFFFFF; padding: 8px; border-radius: 2px; margin-top:  8px;  }
.XAML-info-block .cssXPHTMLBox p {
	line-height: 1em;
	margin-top: 0em;
	margin-bottom: 0em;
}
.XAML-info-block .cssXPHTMLBox dir {
	line-height: 1em;
	margin-top: 0em;
	margin-bottom: 0em;
}

.XAML-grid-tiles { margin-left: calc(-24px/2); width: calc(100% + 32px) !important; }
.XAML-grid-tiles td { vertical-align: top;  }
.XAML-grid-tiles .XAML-stack-tile { margin: 0 calc(24px/2)  24px  calc(24px/2); }
.XAML-grid-tiles .XAML-stack-tile .XAML-stack-tile-title-container { margin: 0 0 8px 0 }

.XAML-grid-tiles .XAML-panel-tile-image { background-color: #FFFFFF; border-radius: 4px; cursor: pointer; margin: 0 0 8px 0;  }
.XAML-grid-tiles .XAML-panel-tile-image .XAML-link-tile-image { background-size: contain; }

.XAML-stack-container,
.XAML-grid-container{
	padding: 0;
	border: 0;
}

.XAML-stack-container-long .XAML-stack-container { padding-right: 16px; }

.XAML-stack-container>table>tbody>tr>td,
.XAML-grid-container>table>tbody>tr>td{
	padding: 4px;
}

.XAML-stack-container>table>tbody>tr:first-child>td,
.XAML-grid-container>table>tbody>tr:first-child>td{
	padding-top: 0;
}
.XAML-stack-container>table>tbody>tr:last-child>td,
.XAML-grid-container>table>tbody>tr:last-child>td{
	padding-bottom: 0;
}
.XAML-stack-container>table>tbody>tr>td:first-child,
.XAML-grid-container>table>tbody>tr>td:first-child{
	padding-left: 0;
}
.XAML-stack-container>table>tbody>tr>td:last-child,
.XAML-grid-container>table>tbody>tr>td:last-child{
	padding-right: 0;
}

.mode-search .XAML-grid-list-container .XAML-stack-container>table>tbody>tr>td { padding: 0px } /* Меняем отрисовку внутри результатов поиска, убираем большой padding между элементами */

/* Переход значений фильтров в поиске на следующую строку, если их очень много */
.XAML-Search-Body .XAML-stack-filters-container  .XAML-grid-filter-content .XAML-stack-container table tr:nth-child(2) td .XAML-stack-container .x-table-layout-cell  { display: inline-block; float: left;  padding-left: 0px;}

.XAML-stack-tiles-container{
	margin: 0 0 24px 0;
}
.XAML-stack-tiles-container>table>tbody>tr>td{
	padding-right: 24px;
}

.XAML-stack-tiles-container>table>tbody>tr>td{
	padding-bottom: 24px;
}

.XAML-stack-tiles-container>table>tbody>tr:first-child>td{
	padding-top: 0;
}

.XAML-stack-tiles-container>table>tbody>tr:last-child>td{
	padding-bottom: 0;
}

.XAML-stack-tiles-container>table>tbody>tr>td:first-child{
	padding-left: 0;
}

.XAML-stack-tiles-container>table>tbody>tr>td:last-child{
	padding-right: 0;
}

.XAML-stack-join{
	padding: 0;
}
.XAML-stack-join>table>tbody>tr>td{
	padding: 0;
}
.XAML-stack-content{
	margin: 8px 24px;
}

.XAML-course-map .XAML-grid-list-item { padding: 8px 16px 0px 8px }
.XAML-course-map .XAML-grid-list-item>table>tbody>tr>td  { padding: calc(8px + 4px) 8px 4px 8px }
.XAML-course-map .XAML-grid-list-item>table>tbody>tr>td:first-child { padding: 16px 0px }

.XAML-course-map .XAML-stack-container-long { padding-bottom:  8px }

.XAML-Learning-Task-Result { padding: 16px 0px 0px 16px; }
@media screen and ( max-width: 360px )
{
	.XAML-Learning-Task-Result .cssXPButton { padding-left: 8px; padding-right: 8px }
}

/*
.XAML-stack-treemap>table>tbody>tr>td{
	padding: 0;
}
.XAML-stack-treemap-item {
	background-color: #f3f3f4;
	padding: 0 24px;
	margin-bottom: 2px;
}
.XAML-stack-treemap-item>table>tbody>tr>td{
	padding: 16px 8px;
}
.XAML-stack-treemap-item:hover{
	background-color: #ebebec;
} */
.XAML-stack-treemap-item .XAML-label-switch{
}

.XAML-label-switch-expanded,
.switcher-expanded{
	background: url(design/default/images/panel-arrow.png) -32px center no-repeat;
	width: 16px;
	height: 16px;
}
.XAML-label-switch-collapsed,
.switcher-collapsed{
	background: url(design/default/images/panel-arrow.png) -96px center no-repeat;
	width: 16px;
	height: 16px;
}


.XAML-image-indent-1{
	margin-left: /* 48px; */ 30px;
}
.XAML-image-indent-2{
	margin-left: 96px;
}

.XAML-image-indent-3{
	margin-left: 144px;
}

.XAML-image-indent-4{
	margin-left: 192px;
}

.XAML-label-info-name{
	font-size: 14px;
	color: #969eb2;
}

.XAML-label-info-value{
	font-size: 14px;
}
.XAML-catalog-filter-table{
	background-color: inherit;
}
.XAML-grid-content-hor-container>table>tbody>tr>td{
	vertical-align: top;
}
.XAML-grid-content-hor-container>table>tbody>tr>td:last-child{
}

.XAML-stack-left-panel-icons-container{
	text-align: center;
}
.XAML-stack-left-panel-icons-container table{
	margin:0 auto;
}


.XAML-label-spacer{
	height: 1rem;
}

.XAML-grid-panel-container>table>tbody>tr>td{
	vertical-align: top;
}

.XAML-label-empty-data{
	text-overflow: ellipsis;
	display: block;
    text-align: center;
	padding: 16px;
}

.XAML-panel-back { padding-bottom: 16px; }
.XAML-back-link { font-size: 16px; font-weight: 500px; padding: calc(8px + 2px);  }

.XAML-nomargin { margin: 0px }
.XAML-nopadding { padding: 0px }

.Upcoming-Events { margin: 0px 0px 24px 0px; }


/*-------------- RichEdit -------------*/

.cssXPRichEdit{
	margin: 16px;
/*	border-radius: 4px; */
}

.XAML-grid-info-table .cssXPRichEdit, .XAML-info-grid-table .cssXPRichEdit { margin: 0px }

.cssXPRichEdit .x-toolbar-default{
	padding: 2px 8px;
}

.wt-spxmltileview-message-nodata{
	display: block;
    text-align: center;
	padding: 16px 0px;
}

/* Todo TileView */

.XAML-todo-tile-image-container { border-radius: 4px }
.XAML-todo-tile-image { background-size: cover !important; border-radius: 4px; cursor: pointer }
.XAML-todo-date { position: absolute; right: 0; top: 0; padding: 4px 8px; font-size: 13px; background-color: #313a4a; color: #FFFFFF; border-radius: 0px 4px 0px 0px; }
.XAML-todo-state { position: absolute; left: 0; top: 0; padding: 4px 8px; font-size: 13px; background-color: #313a4a; color: #FFFFFF; border-radius: 4px 0px 0px 0px; }

/*------------ Image -----------*/

.XAML-image-container{
	background-size: cover !important;
}

.XAML-image-like{
	background: url(design/default/images/social.png) 0 center no-repeat;
	width: 40px !important;
	height: 40px !important;
}
.XAML-image-like:hover{
	background: url(design/default/images/social.png) -40px center no-repeat;
}
.XAML-image-dislike{
	background: url(design/default/images/social.png) -80px center no-repeat;
	width: 40px !important;
	height: 40px !important;
}
.XAML-image-dislike:hover{
	background: url(design/default/images/social.png) -120px center no-repeat;
}

.XAML-grid-list-container .XAML-grid-list-item .XAML-grid-container .XAML-stack-image-counter .XAML-image-like:hover { background: url(design/default/images/social.png) 0 center no-repeat; }
.XAML-grid-list-container .XAML-grid-list-item .XAML-grid-container .XAML-stack-image-counter .XAML-image-dislike:hover { background: url(design/default/images/social.png) -80px center no-repeat; }

/*----------- Social -----------*/
.XAML-stack-image-counter .cssXPLabel{
	background-color: #4176ea;
    width: 24px;
    height: 24px;
    padding: 4px 0;
    border-radius: 50%;
    color: #FFFFFF;
    text-align: center;
    font-size: 13px;
    margin-left: -16px;
	margin-top: 100%;
}
/*------------------------------*/

/*-------------- Informers -----------*/
.XAML-stack-informer,
.informer{
	background-color: #4176ea;
	color: #FFFFFF;
	width: 216px;
	height: calc(216px + 16px);
	border-radius: 4px;
	margin-left: auto;
	margin-right: auto;
/* 	margin: 8px 0; */
}
.XAML-stack-informer>table,
.XAML-stack-informer>table>tbody>tr:nth-child(2){
	height: 100%;
}
.XAML-stack-informer table { width: 100% }
.XAML-stack-informer table,
.XAML-stack-informer tr,
.XAML-stack-informer td{
	box-sizing: border-box;
}
.XAML-label-informer-header,
.informer-header
{
	padding: 8px 24px;
	font-size: 17px;
	font-weight: 500;
	border-bottom: 1px solid #8bb2ff;
	height: calc(32px * 2);
	display: table-cell;
	vertical-align: middle;
	width: 216px;
}

a.XAML-label-informer-header, a.informer-header  { color: #FFF; width: 216px !important }

.XAML-stack-informer-body,
.informer-content{
	text-align: center;
	/* overflow: auto;
	padding: 16px 24px; */
}
.informer-content{
	padding: 8px 0;
}
.XAML-stack-informer-footer,
.informer-footer{
	background-color: #355bbb;
	padding: 8px 24px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
}

.XAML-stack-informer-body .XAML-grid-info-table-compact{
	padding: 0 24px;
	text-align: left;
}
.XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr>td{
	padding: 0;
	font-size: 14px;
}
.XAML-stack-informer-body .XAML-label-grid-column-name{
	color: #8bb2ff;
}
.XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td{
	border-bottom: 1px solid rgba(255, 255, 255, 0.20);
	padding-bottom: 8px;
}
.XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(odd)>td{
	padding-top: 8px;
}
.XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:last-child>td{
	border-bottom-width: 0;
}
.informer-round-out{
	width: 90px;
	height: 90px;
	border: 4px solid #ffffff;
    border-radius: 50%;
	padding: 2px;
	box-sizing: border-box;
	margin: 16px auto;
}
.informer-round-in{
	width: 100%;
	height: 100%;
	border: 2px solid #ffffff;
    border-radius: 50%;
	box-sizing: border-box;
}
.informer-round-value{
	display: table;
	width: 100%;
    height: 100%;
}
.informer-round-value span{
	display: table-cell;
    text-align: center;
    vertical-align: middle;
	font-size: 24px;
}

.wt-info-value-string { font-size: 14px; }
.wt-info-value-string-large { font-size: 72px; }
.wt-info-value-string-value { font-size: 72px; }
.wt-info-dates td { vertical-align: top }

/* Стили для инвертированного слайдера - белый фон, серый текст. Используется в геймификации */

.XAML-stack-informer-invert{
	color: #4176ea;
	background-color: #FFFFFF;
	width: 216px;
	height: calc(216px + 16px);
	border-radius: 4px;
	margin-left: auto;
	margin-right: auto;
}

.XAML-stack-informer-invert .XAML-label-informer-header { border-bottom: 1px solid #f3f3f4; }
.XAML-stack-informer-invert .XAML-grid-info-table-compact { padding: 16px 24px; }
.XAML-stack-informer-invert .XAML-grid-info-table-compact td { vertical-align: top }
.XAML-stack-informer-invert .XAML-stack-informer-body .XAML-label-grid-column-name { color: #969eb2  }
.XAML-stack-informer-invert .XAML-stack-informer-body .XAML-label-grid-column-name.main-label { color: #313a4a; font-size: 17px; font-weight: bold; }
.XAML-stack-informer-invert .XAML-stack-informer-body .XAML-label-grid-column-name.second-label { color: #313a4a; margin-bottom: 16px; }
.XAML-stack-informer-invert .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(odd)>td{ padding-top: 0px }
.XAML-stack-informer-invert .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { padding-bottom: 0px }

.wt-informer .XAML-button { border: 1px solid #FFFFFF; color: #FFFFFF; }
.wt-informer-level td { vertical-align: top; /* border-bottom: 1px solid transparent !important; */ }
.wt-informer-level .main-label { font-weight: bold; font-size: 17px  }

.wtx-informer-link-top
{
	padding: 16px 24px;
	font-size: 17px;
	font-weight: 500;
	border-bottom: 1px solid #8bb2ff;
	display: block;
	color: #FFFFFF;
}

.wtx-informer-link-bottom {
	background-color: #355bbb;
	padding: 8px 24px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	color: #FFFFFF;
	display: block;
}

.mentor-link { color: #FFFFFF; font-size: 19px; padding: 4px 24px 24px 24px; display: block;  }

.wtx-informer-link-bottom:hover, .mentor-link:hover { color: #8bb2ff }

a.wtx-informer-img {
	display: block;
	height: 90px !important;
	width: 90px !important;
	margin: 0 auto !important;
	border-radius: 45px;
	margin: 0px;
	box-sizing: border-box;
	background-size: 90px 90px !important;
}

/* Размещение информера по нижнему краю грида */

.XAML-Grid-Informer .XAML-stack-container { margin-right: 24px; }
.XAML-Grid-Informer td { vertical-align: bottom }
.XAML-Grid-Informer td .wt-informer { margin-bottom: 24px; }

/* ------------ Развитие карьеры -----------------------*/
.XAML-link-block-header { font-weight: bold; font-size: 19px; padding: 0px 0px 16px 0px; display: block; color: #355bbb; }
.Career-panel .XAML-stack-informer { margin: 0px 16px 16px 0px !important;  }

/*------------- Universal (Универсальные) --------------*/

.XAML-text-bold { font-weight: bold }

.XAML-uni-content-container,
.content-container {
	background-color: #ffffff;
	border-radius: 4px;
	margin: 0 0 8px 0;
	/* box-shadow: 1px 1px 8px #c9ccd4; */
}

.XAML-uni-content-block {
	background-color: #ffffff;
	border-radius: 4px;
	margin: 0 0 24px 0;
}

.XAML-uni-content-header { background-color: transparent;  margin: 0 0 24px 0; }
.XAML-uni-content-header tr:nth-child(2) td div { background-color: #ffffff; border-radius: 4px; }
.XAML-uni-content-header tr:nth-child(2) td tr td div { background-color: transparent; border-radius: 0px; }

.XAML-uni-content-header .XAML-stack-filters-container { border-bottom: 0px; }

.XAML-uni-content-header .XAML-grid-filter>table>tbody>tr>td:first-child, .XAML-uni-content-header .XAML-stack-filter>table>tbody>tr>td:first-child { padding-left: 0px !important }
.XAML-label-filters-title {
	font-family:  'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 34px;
	font-weight: 600;
	margin: 0 0 0 0;
	line-height: 1em;
	font-size: 14px;
	padding: 16px  0;
}

/* .XAML-uni-content-block.XAML-uni-content-header .spxmltileview-tile { width: 260px !important } */

.XAML-uni-content-block.XAML-uni-content-header .xaml-tileview-percentage-width-layout.spxmltileview .XAML-stack-tile { margin: 0px 24px 24px 24px !important; }
.XAML-uni-content-block.XAML-uni-content-header .xaml-tileview-percentage-width-layout.spxmltileview .XAML-stack-tile .XAML-image-tile-image { width: 100% !important; }

.XAML-uni-content-block.XAML-uni-content-std .xaml-tileview-percentage-width-layout.spxmltileview .XAML-stack-tile { margin: 0px 24px 24px 24px !important; }
.XAML-uni-content-block.XAML-uni-content-std .xaml-tileview-percentage-width-layout.spxmltileview .XAML-stack-tile .XAML-image-tile-image { width: 100% !important; }

.content-item{
	margin: 8px 24px;
}

/*---------- Communication templates -------------*/

.communication-tile .XAML-image-container { border-radius: 24px }
.communication-tile td { vertical-align: top }
.communication-tile a.XAML-person-link { font-weight: bold; display: block; padding: 8px; }
.communication-tile .XAML-toolbar .XAML-button { margin: 0px 8px; }

.chat-tile { }
.chat-tile .XAML-image-container, .XAML-chat-form .XAML-image-container { border-radius: 32px }
.chat-tile td, .XAML-chat-form td { vertical-align: top }
.chat-tile a.XAML-person-link { font-weight: bold; /* font-size: 17px; */ display: block; padding: 8px; }
.chat-tile .XAML-toolbar .XAML-button { margin: 0px 8px; }

.XAML-chat-form .cssXPEditBox { margin-bottom: 24px; }

.XAML-chat-date { padding: 0px 8px 8px 8px; }

div.XAML-chat-tv div.XAML-chat-html { text-overflow: ellipsis; overflow: none; background-color: #F00; }
div.XAML-chat-tv div.spxmltileview-tile { height: 250px }

/*---------- From 3.4---------------*/
/*---------- From wt-controls.css ---------------*/

.wt-storage { display: none; }

/* discrete scale common */
.wt-discrete-scale { position: relative; line-height: 0; font-size: inherit; white-space: nowrap; font-family: sans-serif; }
.wt-scale-spot { position: absolute; top: 0; overflow: hidden; cursor: pointer; vertical-align: top; }
.wt-zero-spot { position: relative; display: inline-block; margin: 0; padding: 0; cursor: pointer; vertical-align: top; overflow: hidden; line-height: 1; }
.wt-value-spot { position: relative; display: inline-block; margin: 0 0.33em; height: 1em; padding: 0; color: #4176ea; line-height: 1.12; vertical-align: top; }
/* star element */
.wt-star.wt-full path.wt-star-full-path, .wt-star.wt-half path.wt-star-half-path, .wt-star.wt-empty path.wt-star-empty-path { display: inline-block; }
.wt-star.wt-full path.wt-star-half-path, .wt-star.wt-full path.wt-star-empty-path, .wt-star.wt-half path.wt-star-full-path, .wt-star.wt-half path.wt-star-empty-path, .wt-star.wt-empty path.wt-star-full-path, .wt-star.wt-empty path.wt-star-half-path { display: none; }
.wt-star { position: relative; display: inline-block; margin: 0; padding: 0; width: 1em; height: 1em; }
.wt-star svg { position: relative; margin: 0; left: 0; top: 0; width: 100%; height: 100%; }
.wt-star path { fill: #4176ea; stroke-width: 0; stroke: none; }
.wt-star .wt-star-full-path { fill: #4176ea; }
.wt-star .wt-star-half-path { fill: #4176ea; }
.wt-star .wt-star-empty-path { fill: #999; }
/*rect element*/
.wt-rect.wt-full .wt-rect-full, .wt-rect.wt-half .wt-rect-half, .wt-rect.wt-empty .wt-rect-empty { display: block; }
.wt-rect.wt-full .wt-rect-half, .wt-rect.wt-full .wt-rect-empty, .wt-rect.wt-half .wt-rect-full, .wt-rect.wt-half .wt-rect-empty, .wt-rect.wt-empty .wt-rect-full, .wt-rect.wt-empty .wt-rect-half { display: none; }
.wt-rect { position: relative; display: inline-block; margin: 0; padding: 0; width: 1em; height: 1em; }
.wt-rect .wt-rect-full { position: relative; width: 1em; height: 1em; border-style: solid; border-width: 0.1em; border-radius: 0.1em; padding: 0; margin: 0; border-color: #900; background-color: #C00; background-image: linear-gradient(0, #C00, #FCC); overflow: hidden; box-sizing: border-box; }
.wt-rect .wt-rect-half, .wt-rect .wt-rect-empty { position: relative; width: 1em; height: 1em; border-style: solid; border-width: 0.1em; border-radius: 0.1em; padding: 0; margin: 0; border-color: #900; background-color: transparent; overflow: hidden; box-sizing: border-box; }
.wt-rect .wt-rect-half .wt-rect-half-fill { position: relative; width: 50%; height: 100%; border-style: none; border-width: 0; padding: 0; margin: 0; background-color: #C00; background-image: linear-gradient(0, #C00, #FCC); }

/*  cont-scale type=circular */
.wt-circular-scale { display: inline-block; position: relative; white-space: nowrap; font-family: sans-serif;}
.wt-circular-scale .wt-circular-bg { position: absolute; }
.wt-circular-click .wt-circular-bg { background-image: url(img/click.svg); background-repeat: no-repeat; background-size: 75%; background-position: center center; }
.wt-circular-scale .wt-circular-value { position: absolute; text-align: center; font-family: inherit; color: #4176ea; }
.wt-circular-scale .wt-circular-path { stroke: none; }
.wt-circular-scale .wt-circular-path-bg { fill: #ffffff; }
.wt-circular-scale .wt-circular-path-0 { fill: #4176ea; }
.wt-circular-scale .wt-circular-path-1 { fill: #28e; }
.wt-circular-scale .wt-circular-path-2 { fill: #4af; }
.wt-circular-scale .wt-circular-path-3 { fill: #6cf; }
.wt-circular-scale .wt-circular-path-4 { fill: #8ff; }
.wt-circular-scale .wt-circular-path-5 { fill: #aff; }
.wt-circular-scale .wt-circular-tip { display: none; z-index: 9000; position: absolute; padding: 0.25em; font-size: 12px; border-style: solid; border-width: 1px; white-space: nowrap; font-size: 14px; font-family: sans-serif; font-weight: bold; background-color: #fff; border-radius: 0.25em; box-shadow: 1px 1px 3px rgba(0,0,0,0.5); color: #000000 !important; }

.wt-histogram-scale { display: inline-block; position: relative; white-space: nowrap; font-family: Roboto, sans-serif; font-size: 16px; }
.wt-histogram-scale .wt-histogram-bar-outer { position: absolute; box-sizing: border-box; background-color: transparent; border-color: #4176ea; border-width: 0.25em; border-style: solid; }
.wt-histogram-scale .wt-histogram-bar-outer-0 { background-color: #cdf; border-color: #4176ea; }
.wt-histogram-scale .wt-histogram-bar-outer-1 { background-color: #cdf; border-color: #28e; }
.wt-histogram-scale .wt-histogram-bar-outer-2 { background-color: #cdf; border-color: #4af; }
.wt-histogram-scale .wt-histogram-bar-outer-3 { background-color: transparent; border-color: #6cf; }
.wt-histogram-scale .wt-histogram-bar-outer-4 { background-color: transparent; border-color: #8ff; }
.wt-histogram-scale .wt-histogram-bar-outer-5 { background-color: transparent; border-color: #aff; }
.wt-histogram-scale .wt-histogram-bar { position: absolute; background-color: #c00; }
.wt-histogram-scale .wt-histogram-bar-0 { background-color: #4176ea; }
.wt-histogram-scale .wt-histogram-bar-1 { background-color: #28e; }
.wt-histogram-scale .wt-histogram-bar-2 { background-color: #4af; }
.wt-histogram-scale .wt-histogram-bar-3 { background-color: #6cf; }
.wt-histogram-scale .wt-histogram-bar-4 { background-color: #8ff; }
.wt-histogram-scale .wt-histogram-bar-5 { background-color: #aff; }
.wt-histogram-scale .wt-histogram-bar-value { position: absolute; font-weight: bold; }
.wt-histogram-scale .wt-histogram-value-on { color: #fff; text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.wt-histogram-scale .wt-histogram-value-out { text-shadow: 1px 1px 2px rgba(0,0,0,0.5); }
.wt-histogram-scale .wt-histogram-value-out-0 { color: #4176ea;}
.wt-histogram-scale .wt-histogram-value-out-1 { color: #28e;}
.wt-histogram-scale .wt-histogram-value-out-2 { color: #4af;}
.wt-histogram-scale .wt-histogram-value-out-3 { color: #6cf;}
.wt-histogram-scale .wt-histogram-value-out-4 { color: #8ff;}
.wt-histogram-scale .wt-histogram-value-out-5 { color: #aff;}
.wt-histogram-scale .wt-histogram-axes { position: absolute; left: 0; top: 0; box-sizing: border-box; border-color: #4176ea; border-width: 0.25em; }
.wt-histogram-scale .wt-histogram-grid { position: absolute; box-sizing: border-box; border-color: #4176ea; border-width: 0.125em; }
.wt-histogram-scale .wt-histogram-grid-v { left: 0; top: 0; border-style: none dotted none none; }
.wt-histogram-scale .wt-histogram-grid-v-0 { border-style: none dotted none dotted; }
.wt-histogram-scale .wt-histogram-grid-h { left: 0; bottom: 0; border-style: dotted none none none; }
.wt-histogram-scale .wt-histogram-grid-h-0 { border-style: dotted none dotted none; }
.wt-histogram-scale .wt-histogram-tip { display: none; z-index: 9000; position: absolute; padding: 0.25em; font-size: 12px; border-style: solid; border-width: 1px; white-space: nowrap; font-size: 14px; font-family: sans-serif; font-weight: bold; background-color: #fff; border-radius: 0.25em; box-shadow: 1px 1px 3px rgba(0,0,0,0.5); }
.wt-histogram-scale .wt-histogram-threshold { position: absolute; box-sizing: border-box; border-color: #060; border-style: solid; }
.wt-histogram-scale .wt-histogram-threshold-bt { height: 0; margin: 0 0 -0.125em 0; border-width: 0.25em 0 0 0; }
.wt-histogram-scale .wt-histogram-threshold-tb { height: 0; margin: -0.125em 0 0 0; border-width: 0 0 0.25em 0; }
.wt-histogram-scale .wt-histogram-threshold-lr { width: 0; margin: 0 0 0 -0.125em; border-width: 0 0.25em 0 0; }
.wt-histogram-scale .wt-histogram-threshold-rl { width: 0;  margin: 0 -0.125em 0 0; border-width: 0 0 0 0.25em; }

.wt-histogram-scale .wtx-histogram-mark { position: absolute; }
.wt-histogram-scale .wtx-histogram-mark-v { left: 0; top: 0; }
.wt-histogram-scale .wtx-histogram-mark-h { left: 0; bottom: 0;}
.wt-histogram-scale .wtx-histogram-mark-inner { position: absolute; box-sizing: border-box; border-color: #4176ea; border-width: 0.25em; }
.wt-histogram-scale .wtx-histogram-mark-v .wtx-histogram-mark-top { left: 0; top: 0; height: 0.5em; border-style: none solid none none; }
.wt-histogram-scale .wtx-histogram-mark-v .wtx-histogram-mark-bottom { left: 0; bottom: 0; height: 0.5em; border-style: none solid none none; }
.wt-histogram-scale .wtx-histogram-mark-v-0 .wtx-histogram-mark-top { border-style: none solid none solid; }
.wt-histogram-scale .wtx-histogram-mark-v-0 .wtx-histogram-mark-bottom { border-style: none solid none solid; }
.wt-histogram-scale .wtx-histogram-mark-h .wtx-histogram-mark-left { left: 0; bottom: 0; width: 0.5em; border-style: solid none none none; }
.wt-histogram-scale .wtx-histogram-mark-h .wtx-histogram-mark-right { right: 0; bottom: 0; width: 0.5em; border-style: solid none none none; }
.wt-histogram-scale .wtx-histogram-mark-h-0 .wtx-histogram-mark-left { border-style: solid none solid none; }
.wt-histogram-scale .wtx-histogram-mark-h-0 .wtx-histogram-mark-right { border-style: solid none solid none; }
.wt-histogram-scale .wtx-histogram-series-names { position: relative; height: 2.5em; }
.wt-histogram-scale .wtx-histogram-series-name { position: absolute; top: 0.25em; font-size: 0.75em; color: #4176ea; font-weight: bold; text-align: center; }
.wt-histogram-scale .wtx-histogram-legend { position: relative; }
.wt-histogram-scale .wtx-histogram-legend-item { position: relative; font-size: 0.8em; margin: 0 0 0.5em 1em; }
.wt-histogram-scale .wtx-histogram-legend-item-color { position: relative; vertical-align: middle; display: inline-block; width: 1em; height: 1em; margin: 0 0.5em 0 0; }
.wt-histogram-scale .wtx-histogram-legend-item-title { position: relative; vertical-align: middle; alignment-baseline: middle; display: inline-block; }
/* graph */
.wt-info-graph {
	position: relative;
	margin: 8px auto;
}
.wt-info-graph .wt-info-graph-axes { position: absolute; box-sizing: border-box; left: 0; top: 0; border-color: #355bbb; }
.wt-info-graph .wt-info-graph-grid { position: absolute; box-sizing: border-box; left: 0; top: 0; }
.wt-info-graph .wt-info-graph-grid-v { position: absolute; box-sizing: border-box; left: 0; top: 0; border-color: #355bbb; border-style: none dotted none none; }
.wt-info-graph .wt-info-graph-grid-v-first { border-style: none dotted none dotted; }
.wt-info-graph .wt-info-graph-grid-h { position: absolute; box-sizing: border-box; left: 0; bottom: 0; border-color: #355bbb; border-style: dotted none none none; }
.wt-info-graph .wt-info-graph-grid-h-first { border-style: dotted none dotted none; }
.wt-info-graph .wt-info-graph-area { position: absolute; left: 0; top: 0; }
.wt-info-graph .wt-info-graph-values { position: absolute; left: 0; top: 0; font-size: 14px; }
.wt-info-graph .wt-info-graph-values-v { transform: rotate(-90deg); }
.wt-info-graph .wt-info-graph-name {
	position: absolute;
	left: 0;
	top: 0;
	text-align: center;
	font-size: 14px;
}
.wt-info-graph .wt-info-graph-name-v { transform: rotate(-90deg); }
.wt-info-graph .wt-info-graph-value { position: absolute; color: #355bbb;  }
.wt-info-graph svg { position: absolute; left: 0; top: 0; }
.wt-info-graph .wt-info-graph-tip {
	display: none;
	position: absolute;
	left: 0;
	top: 0;
	font-size: 14px;
	font-weight: 500;
	background-color: #ffffff;
	border-radius: 2px;
	border: 1px solid #355bbb;
	box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
.wt-info-graph .wt-info-graph-tip table { position: relative; border-spacing: 0; }
.wt-info-graph .wt-info-graph-tip td {
	text-align: center;
	padding: 8px;
}


.wt-informer-vertical { display: inline-block; font-size: inherit; font-family: Roboto, sans-serif; margin: 1em 0 0 1em; padding: 1em; background-color: #4176ea; width: 18em; }
.wt-informer-vertical .wt-informer-header { margin: 0.5em auto; font-size: 2em; text-align: center; color: #fff; }
.wt-informer-vertical .wt-informer-scale-container { width: 12em; margin: 1em auto; text-align: center; }
.wt-informer-vertical .wt-circular-bg {  }
.wt-informer-vertical .wt-informer-footer { margin: 1em auto; font-size: 1em; text-align: center; }
.wt-informer-vertical .wt-circular-path-bg { fill: #69c; }
.wt-informer-vertical .wt-circular-path-0 { fill: #fff; }
.wt-informer-vertical .wt-informer-label-0 { color: #fff; font-size: 1.2em; line-height: 1.2em; text-align: center; }
.wt-informer-vertical .wt-circular-scale .wt-circular-tip { z-index: 9000; font-size: 14px; font-family: Roboto, sans-serif; border-color: #fff; background-color: #4176ea; border-radius: 0.25em; box-shadow: 1px 1px 3px rgba(0,0,0,0.5); }


.wt-informer-vertical.wt-informer-man .wt-circular-bg { background-image: url(/pics/xaml/man.svg); background-repeat: no-repeat; background-size: 60%; background-position: center center; }
.wt-informer-vertical.wt-informer-doc .wt-circular-bg { background-image: url(/pics/xaml/doc.svg); background-repeat: no-repeat; background-size: 60%; background-position: center center; }
.wt-informer-vertical.wt-informer-comp .wt-circular-bg { background-image: url(/pics/xaml/comp.svg); background-repeat: no-repeat; background-size: 60%; background-position: center center; }


.wt-informer-horizontal { display: inline-block; font-size: inherit; font-family: Roboto, sans-serif; margin: 1em 0 0 1em; padding: 1em; background-color: #4176ea; width: 37em; }
.wt-informer-horizontal .wt-informer-scale { margin: 0 1em 0 0; font-size: 2em; text-align: center; }
.wt-informer-horizontal .wt-informer-scale-container { position: relative; margin: 2em; width: 12em; height: 12em; }
.wt-informer-horizontal .wt-circular-path-bg { fill: #69c; }
.wt-informer-horizontal .wt-circular-path-0 { fill: #cdf; }
.wt-informer-horizontal .wt-circular-path-1 { fill: #ace; }
.wt-informer-horizontal .wt-circular-path-2 { fill: #9bd; }
.wt-informer-horizontal .wt-informer-label-container { padding: 0 0 0 1em; }
.wt-informer-horizontal .wt-informer-label-0 { color: #cdf; font-size: 1.2em; padding: 0.5em 0; }
.wt-informer-horizontal .wt-informer-label-1 { color: #ace; font-size: 1.2em; padding: 0.5em 0; }
.wt-informer-horizontal .wt-informer-label-2 { color: #9bd; font-size: 1.2em; padding: 0.5em 0; }
.wt-informer-horizontal .wt-circular-scale .wt-circular-tip { z-index: 9000; font-size: 14px; font-family: Roboto, sans-serif; border-color: #fff; background-color: #4176ea; border-radius: 0.25em; box-shadow: 1px 1px 3px rgba(0,0,0,0.5); }

.wt-rating-block { display: inline-block; font-size: 18px; font-family: Roboto, sans-serif; margin: 1em 0 1em 1em; color: #4176ea; }
.wt-rating-block .wt-rating-label {}
.wt-rating-block .wt-discrete-scale { margin: 0 0 0 1em; }

/*Page1*/
/*informers begin*/
.wt-info-simple { position: relative; display: inline-block; font-size: 18px; width: 12em; height: 12em; margin: 0.25em; background-color: #eceff1; color: #263238; font-family: Roboto, sans-serif; padding: 0 !important; }
.wt-info-simple .wt-info-header { position: relative; margin: 0; font-size: 1em; height: 2.5em; line-height: 1.5em; background-color: #8ed100; color: #fff; padding: 0.5em 1em; text-transform: uppercase; }
.wt-info-simple .wt-info-body { position: relative; width: 12em; height: 9.9em; padding: 0 !important; }
.wt-info-simple .wt-info-body.wt-info-body-center-middle { text-align: center; line-height: 9.9em; }

.wt-info-learning { font-size: 20px; width: 15em; height: 15em; }
.wt-info-learning .wt-info-header { font-size: 1em; height: 3.1em; line-height: 1.5em; background-color: #8ed100; color: #fff; padding: 0.8em 1em; text-transform: uppercase; }
.wt-info-learning .wt-info-main { padding: 1em; line-height: 1em !important;  }
.wt-info-learning .wt-info-body { margin: 0 auto; width: 12em; height: 8em; }
.wt-info-learning .wt-info-scale-holder { width: 5em; margin: 0 auto; }
.wt-info-learning .wt-info-scale-holder-left { margin: 0 0.5em; }
.wt-info-learning .wt-info-scale-holder-right { margin: 0 0.5em; }
.wt-info-learning .wt-info-scale-header { font-size: 0.75em; line-height: 1em; text-align: center; white-space: normal; }
.wt-info-learning .wt-info-scale { line-height: 1em; margin: 0.5em 0; }
.wt-info-learning .wt-circular-path-bg { fill: #dcd7d5 !important; }
.wt-info-learning .wt-circular-path-0 { fill: #558b2f !important; }
.wt-info-learning .wt-circular-value { font-size: 1.75em !important; color: #263238 !important; }
.wt-info-learning .wt-info-footer { border-top: solid 0.0625em #8ed100; padding: 1em 0.5em 0 0.5em; }
.wt-info-learning .wt-info-footer-text  { font-size: 0.75em; color: #263238; }
.wt-info-learning .wt-info-footer-value  { font-size: 1.25em; color: #c00; margin: 0 0.5em; }
.wt-info-learning .wt-info-value-holder { width: 12em; margin: 0 auto; }
.wt-info-learning .wt-info-value-header { font-size: 0.75em; color: #263238; text-align: left; }
.wt-info-learning .wt-info-value { font-size: 5em; height: 1.33em; width: 2em; line-height: 1.33em; color: #263238; text-align: center; }

/* .wt-info-score .wt-info-body { line-height: 1em !important; } */
.wt-info-score .wt-info-circular-scale-container {
	position: relative;
	width: 12em;
	padding: 16px 3em;
	margin: 0 auto;
}
.wt-info-score .wt-circular-path-bg { fill: #8bb2ff !important; }
.wt-info-score .wt-circular-path-0 { fill: #FFFFFF; }
.wt-info-score .wt-circular-path-1 { fill: #355bbb; }
.wt-info-score .wt-circular-value { color: #ffffff !important; }

.wt-progress-bar { position: relative; margin: 10px; display: inline-block; box-sizing: content-box !important; /* border: solid 1px #8ed100; */ background-color: #fff; overflow: hidden; padding: 0;  }
.wt-progress-bar .wt-progress-scale { position: absolute; left: 0; bottom: 0; display: inline-block; margin: 0; border: solid 1px #fff; background-color: #8ed100;  }

.wt-progress-bar.wt-course-status { background-color: #fff; }
.wt-progress-bar.wt-course-status-0, .wt-progress-bar.wt-course-status-1, .wt-progress-bar.wt-course-status-2 { /* border: solid 1px #8ed100;  */}
.wt-progress-bar.wt-course-status-3 { border: solid 1px #c00; }
.wt-progress-bar.wt-course-status-4 { border: solid 1px #363; }
.wt-progress-bar.wt-course-status-5 { border: solid 1px #666; }
.wt-progress-bar.wt-course-status .wt-progress-scale { border: solid 1px #fff; }
.wt-progress-bar.wt-course-status-0 .wt-progress-scale, .wt-progress-bar.wt-course-status-1 .wt-progress-scale, .wt-progress-bar.wt-course-status-2 .wt-progress-scale { background-color: #8ed100; background-image: linear-gradient(0deg,#8ed100,#bbcad0 ); }
.wt-progress-bar.wt-course-status-3 .wt-progress-scale { background-color: #c00; background-image: linear-gradient(0deg,#c00,#ff8484); }
.wt-progress-bar.wt-course-status-4 .wt-progress-scale { background-color: #363; background-image: linear-gradient(0deg,#363,#80bf80); }
.wt-progress-bar.wt-course-status-5 .wt-progress-scale { background-color: #666; background-image: linear-gradient(0deg,#666,#999); }

/*.wtx-row-with-informers > td { padding: 0.5em; }*/

.wtx-informer { position: relative; display: inline-block; font-size: 180px; width: 1em; height: 1em; padding: 0; /* border: solid 0.016em #4176ea; */ margin: 0.05em 0 0 0.05em; background-color: #FFF; border-radius: 4px; }
.wtx-informer-header { font-size: 0.08em; line-height: normal; position: relative; display: block; left: 0; top: 0; width: 12em; padding: 0.75em; color: #4176ea; font-weight: 600; text-transform: uppercase; }
.wtx-informer-value { font-size: 0.25em; line-height: 1em; position: absolute; bottom: 1.66em; display: block; width: 100%; height: auto; color: #4176ea; font-weight: 500; padding: 0; text-align: center; }
.wtx-informer-icon-holder { position: absolute; bottom: 0.16em; left: 0; width: 100%; height: 1em; font-size: 0.33em !important; text-align: center; }
.wtx-informer-icon { position: relative; width: 1em; height: 1em; }
.wtx-informer-single { margin: 0 0 0 0.05em}

.wtx-informer-icon-holder.wtx-informer-icon-people path, .wtx-informer-icon-holder.wtx-informer-icon-people circle { fill: #4176ea; stroke: none; }
.wtx-informer-icon-holder.wtx-informer-icon-course path { fill: #4176ea; stroke: none; }
.wtx-informer-icon-holder.wtx-informer-icon-test path { fill: #4176ea; stroke: none; }
.wtx-informer-icon-holder.wtx-informer-icon-event path { fill: #4176ea; stroke: none; }
.wtx-informer-icon-holder.wtx-informer-icon-person path { fill: #4176ea; stroke: none; }

.wtx-informer-4x2 { width: 4.15em; height: 2.05em; }
.wtx-informer-4x2 .wtx-informer-header { width: 48em; }
.wtx-informer-4x3 { width: 4.15em; height: 3.10em; }
.wtx-informer-4x3 .wtx-informer-header { width: 48em; }
.wtx-informer-3-5xauto { width: 3.75em; height: auto !important; }
.wtx-informer-3-5xauto .wtx-informer-header { width: auto; }
.wtx-informer-4xauto { width: 4.15em; height: auto !important; }
.wtx-informer-4xauto .wtx-informer-header { width: 48em; }
.wtx-informer-autoxauto { width: auto; height: auto !important; }
.wtx-informer-4xauto .wtx-informer-header { width: auto; }
.wtx-informer-4-5xauto { width: 4.7em; height: auto !important; }
.wtx-informer-4-5xauto .wtx-informer-header { width: auto; }
.wtx-informer-5xauto { width: 5.2em; height: auto !important; }
.wtx-informer-5xauto .wtx-informer-header { width: auto; }

.wtx-informer-graph { font-size: 0.08em; padding: 0 0.75em 0.75em 0.75em; }

.wtx-informer-top-items { width: 100%; height: auto !important; font-size: 150px; margin: 0 0 16px 0; padding: 0.06em 0em; }
.wtx-informer-top-items .wtx-informer-header { width: 100%; font-size: 0.1em; }
.wtx-informer-top-items .wtx-top-item { font-size: 0.08em; background-color: #f3f3f4; font-size: 0.08em; margin: 0.75em 1.5em; }
.wtx-informer-top-items .wtx-top-item .wtx-informer-header-inner { font-size: 1.2em; line-height: normal; position: relative; display: block; left: 0; top: 0; width: auto; padding: 0.75em; color: #4176ea; font-weight: 600; }
.wtx-informer-top-items .wtx-top-item-body { }
.wtx-informer-top-items .wtx-top-item-body td { vertical-align: top; }
.wtx-informer-top-items .wt-info-circular-scale-container { width: 10em; height: 10em; padding: 0.5em 1em; }
.wtx-informer-top-items .wt-top-item-param { font-size: 1.1em; padding: 0.25em 0.5em; }
.wtx-informer-top-items .wt-top-item-value { font-size: 1.1em; padding: 0.25em 0.5em 0.25em 0; color: #4176ea; }

.wtx-informer-top-items .panel-horizontal .wt-info-circular-scale-container { }
.wtx-informer-top-items .panel-vertical .wt-info-circular-scale-container { margin: 0 auto; }
.wtx-informer-top-items .panel-vertical .wt-top-item-param { padding: 0.5em 1em;  }

/*
.wt-person-compare-img { position: relative; display: block; width: 15em !important; height: 15em !important; background-size: cover !important; }
.wt-person-compare-row > td { padding: 0.5em; text-align: center; border-right: groove 2px #fff; width: 14em; }
.wt-person-compare-row:nth-child(even) > td { background-color: #eee; }
.wt-person-compare-row:nth-child(odd) > td { }
.wt-person-compare-row:last-of-type > td { border-bottom: groove 2px #fff;}
.wt-compare-grid{overflow-x: auto;}
.wt-compare-grid, .wt-compare-grid > table { width: auto !important; }
.wt-tab-item-scroll-h > div { overflow: auto !important; overflow-x: auto !important; overflow-y: hidden !important; }
*/
/* .wtx-informer-body { position: relative; font-size: 0.08em; padding: 0 1em 1em 1em; }
.wtx-stack-flow { position: relative; width: inherit;  }
.wtx-stack-flow-item { position: relative; width: 10em;  height: 10em; margin: 0 0.5em 0.5em 0; display: inline-block; background-position: center center; background-repeat: no-repeat; background-size: cover; }
.wtx-informer-body-more { display: block; padding: 0.5em 0 0 0; cursor: pointer; }
.wtx-informer-body-footer { position: relative; border-top: solid 0.05em #4176ea; padding: 0.5em 0 0 0; margin: 0.5em 0 0 0; }
.wtx-informer-body-footer-text { line-height: 1.5em; text-align: right; color: #4176ea; }
.wtx-informer-body-footer-value { font-size: 1.5em; font-weight: bold; line-height: 1.5em; padding: 0 0 0 0.5em; color: #4176ea; } */

/* .wtx-informer-my-team { width: 52vw; height: auto !important; }
.wtx-informer-my-team .wtx-informer-header { width: auto; }
.wtx-informer-my-team .wtx-stack-flow-item { width: 8vw; height: 8vw; }
 */

.wtx-stack-flow{
	padding: 0 !important;
	width: calc(100% + 24px) !important;
	margin-left: -12px;
}
.wtx-stack-flow-item{
	display: inline-block;
	float: left;
	width: 96px !important;
	height: 96px !important;
	margin: 16px 12px !important;
	background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
	border-radius: 50%;
}
.wtx-informer-body-more{
	margin: 108px 12px !important;
}



/* --- Green informer --- */
.XAML-stack-informer.green, .informer.green { background-color: #8ed100; }
.green .XAML-label-informer-header, .green .informer-header { border-bottom: 1px solid #c7e880; }
.green .XAML-stack-informer-body .XAML-label-grid-column-name { color: #6a9d00; }
.green .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #c7e880; }
.green .XAML-stack-informer-footer, .green .informer-footer {  border-top: 1px solid #6a9d00;  background-color: #6a9d00; }
.green .wt-info-score .wt-circular-path-bg { fill: #6a9d00 !important; }
.green .wt-info-score .wt-circular-path-1 { fill: #c7e880; }

/* --- Red informer --- */

.XAML-stack-informer.red, .informer.red { background-color: #fd6471; }
.red .XAML-label-informer-header, .red .informer-header { border-bottom: 1px solid #feb2b8; }
.red .XAML-stack-informer-body .XAML-label-grid-column-name { color: #be4b55; }
.red .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #feb2b8; }
.red .XAML-stack-informer-footer, .red .informer-footer {  border-top: 1px solid #be4b55;  background-color: #be4b55; }
.red .wt-info-score .wt-circular-path-bg { fill: #be4b55 !important; }
.red .wt-info-score .wt-circular-path-1 { fill: #feb2b8; }

/* --- Orange informer --- */

.XAML-stack-informer.orange, .informer.orange { background-color: #fdae46; }
.orange .XAML-label-informer-header, .orange .informer-header { border-bottom: 1px solid #fed7a3; }
.orange .XAML-stack-informer-body .XAML-label-grid-column-name { color: #be8234; }
.orange .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #fed7a3; }
.orange .XAML-stack-informer-footer, .orange .informer-footer {  border-top: 1px solid #be8234;  background-color: #be8234; }
.orange .wt-info-score .wt-circular-path-bg { fill: #be8234 !important; }
.orange .wt-info-score .wt-circular-path-1 { fill: #fed7a3; }

/* --- Blue informer --- */

.XAML-stack-informer.blue, .informer.blue { background-color: #27a8fd; }
.blue .XAML-label-informer-header, .blue .informer-header { border-bottom: 1px solid #93d4fe; }
.blue .XAML-stack-informer-body .XAML-label-grid-column-name { color: #1d7ebe; }
.blue .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #93d4fe; }
.blue .XAML-stack-informer-footer, .blue .informer-footer {  border-top: 1px solid #1d7ebe;  background-color: #1d7ebe; }
.blue .wt-info-score .wt-circular-path-bg { fill: #1d7ebe !important; }
.blue .wt-info-score .wt-circular-path-1 { fill: #93d4fe; }

/* --- Violet informer --- */

.XAML-stack-informer.violet, .informer.violet { background-color: #8b7ec0; }
.violet .XAML-label-informer-header, .violet .informer-header { border-bottom: 1px solid #c5bfe0; }
.violet .XAML-stack-informer-body .XAML-label-grid-column-name { color: #685e90; }
.violet .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #c5bfe0; }
.violet .XAML-stack-informer-footer, .violet .informer-footer {  border-top: 1px solid #685e90;  background-color: #685e90; }
.violet .wt-info-score .wt-circular-path-bg { fill: #685e90 !important; }
.violet .wt-info-score .wt-circular-path-1 { fill: #c5bfe0; }

/* --- Black informer --- */

.XAML-stack-informer.black, .informer.black { background-color: #000000; }
.black .XAML-label-informer-header, .black .informer-header { border-bottom: 1px solid #808080; }
.black .XAML-stack-informer-body .XAML-label-grid-column-name { color: #bfbfbf; }
.black .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #808080; }
.black .XAML-stack-informer-footer, .black .informer-footer {  border-top: 1px solid #808080;  background-color: #808080; }
.black .wt-info-score .wt-circular-path-bg { fill: #808080 !important; }
.black .wt-info-score .wt-circular-path-1 { fill: #bfbfbf; }

/* --- White informer --- */

.XAML-stack-informer.white, .informer.white { background-color: #FFFFFF; color: #000000; border: 1px solid #c7cad2; }
.white .XAML-label-informer-header, .white .informer-header { border-bottom: 1px solid #c7cad2; }
.white .XAML-stack-informer-body .XAML-label-grid-column-name { color: #bdbdbd; }
.white .XAML-stack-informer-body .XAML-grid-info-table-compact>table>tbody>tr:nth-child(even)>td { border-bottom: 1px solid #c7cad2; }
.white .XAML-stack-informer-footer, .white .informer-footer {  border-top: 1px solid #c7cad2;  background-color: #c7cad2; }
.white .wt-progress-bar { background-color: #e6e6e6; border: 1px solid #c7cad2 }
.white .wt-info-score .wt-circular-value { color: #000000 !important; }
.white .wt-info-score .wt-circular-path-bg { fill: #808080 !important; }
.white .wt-info-score .wt-circular-path-0 { fill: #e6e6e6 !important; }
.white .wt-info-score .wt-circular-path-1 { fill: #c7cad2; }

/* --- Informer with icons--- */

.XAML-stack-informer.icon { width:216px; /* height: auto; */ background-color: #FFFFFF; color: #000000; }
.XAML-stack-informer.icon a.XAML-label-informer-header, .XAML-stack-informer.icon a.informer-header { color: black; width: 216px !important;  }

.XAML-stack-informer.icon-large { width: 376px; height: auto; background-color: #FFFFFF; color: #000000; }
.XAML-stack-informer.icon-large a.XAML-label-informer-header, .XAML-stack-informer.icon-large a.informer-header { color: black; width: 376px !important;  }

.XAML-stack-informer.icon .wt-info-value-string-large, .XAML-stack-informer.icon-large .wt-info-value-string-large { font-size: 64px;  line-height: 64px; font-weight: bold; }

.XAML-stack-informer.icon .wt-info-body-center-middle td:nth-child(1),
.XAML-stack-informer.icon-large .wt-info-body-center-middle td:nth-child(1) { width: 100%; padding-left: 24px; padding-bottom: 24px; text-align: left; }
.XAML-stack-informer.icon .wt-info-body-center-middle td td:nth-child(1),
.XAML-stack-informer.icon-large .wt-info-body-center-middle td td:nth-child(1) { width: auto; padding-left: 0px; padding-bottom: 0px; }
.XAML-stack-informer.icon .wt-info-body-center-middle td:nth-child(2),
.XAML-stack-informer.icon-large .wt-info-body-center-middle td:nth-child(2) { vertical-align: bottom; padding-right: 24px; padding-bottom: 24px; text-align: right;}

.XAML-stack-informer.icon table tr:last-child td { vertical-align: bottom }
.XAML-stack-informer.icon .XAML-label-informer-header { padding-top: 24px !important; }
.XAML-stack-informer.icon .XAML-label-informer-header, .XAML-stack-informer.icon .informer-header,
.XAML-stack-informer.icon-large .XAML-label-informer-header, .XAML-stack-informer.icon-large .informer-header { border-bottom: 0px solid #000000 }



.XAML-stack-informer.icon .wt-info-circular-scale-container {  width: auto; margin: 0; padding: 0px 0px; }
.XAML-stack-informer.icon .wt-info-course-score-scale { width: 80px !important; height: 80px !important; }
.XAML-stack-informer.icon .wt-circular-scale .wt-circular-value { text-align: center !important; color: #000000  !important; top: 8px  !important; left: 16px  !important; font-size: 20px !important; line-height: 64px !important; width: 40px !important; height: auto !important; margin: 0 auto !important; }
.XAML-stack-informer.icon .wt-circular-path-0 { fill: #4176ea }}

/* tree-map */
.mp-outer {
	font-size: 13px;
	padding-top: 0.6em;
	margin: 0.6em auto 0 auto;
	overflow: auto;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.mp-main {
	transform-origin: 0% 0%;
	transform: scale(1, 1);
	margin: 8px 0 0 8px;
	margin-top: 4em !important;
}

.mp-main > .mp-draw { position: absolute; left: 0; top: 0; z-index: 0; transform-origin: 0% 0%; }
.mp-main > .mp-elems { position: absolute; left: 0; top: 0; z-index: 1; transform-origin: 0% 0%; cursor: move; }
.mp-main > .mp-tips { position: absolute; left: 0; top: 0; z-index: 2; display: none; }
.mp-controls {
	position: absolute;
	left: auto !important;
	right: 0;
	top: -3em;
	z-index: 3;
}
.mp-draw > .mp-main-svg { position: absolute; left: 0; top: 0; }

.mp-elems .mp-div {
	position: absolute;
	box-sizing: border-box;
	/* border: 1px solid #4176ea;  */
	box-shadow: 0.1em 0.1em 0.2em rgba(0,0,0,0.5);
	overflow: hidden;
	cursor: pointer;
	background-color: #ffffff;
	border-radius: 4px;
}

.mp-elems .mp-form-roundrect { /*border-radius: 1em;*/ }
.mp-elems .mp-form-ellipse { border-radius: 50%; }
.mp-elems .mp-div-hl { background-color: #def; box-shadow: 0.1em 0.1em 0.6em rgba(0,0,0,0.9) }
.mp-elems .mp-div-src { background-color: #fed; box-shadow: 0.1em 0.1em 0.6em rgba(0,0,0,0.9) }
.mp-elems .mp-toggle {
	position: absolute;
	box-sizing: content-box;
	background-color: #fff;
	border-style: solid;
	border-color: #4176ea;
	color: #4176ea;  /*#0080C0*/
	text-align: center;
	border-radius: 50%;
	line-height: 1;
	cursor: pointer;
}
.mp-elems .mp-current-item-selected { box-shadow: 0 0 2em red; }

.mp-elems .mp-div .mp-div-title {
	position: relative;
	/* font-size: 1em;  */
	/* color: #fff;  */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 8px;
	/* background-color: #999;  */
	/* text-shadow: 0.1em 0.1em 0.3em rgba(0,0,0,0.5);  */
	border-bottom: 1px solid #ebebec;
}
/* Взятие по значению аттрибута - грязный хак. Кто-то явно выставляет цвет, при этом не добавляет класса, позволяющего идентифицировать элемент */
.mp-elems .mp-div .mp-div-title[style="background-color: gray;"]{
	background-color: #8bb2ff !important;
	color: #ffffff !important;
}
.mp-elems .mp-div .mp-div-title[style="background-color: green;"]{
	background-color: #4176ea !important;
	color: #ffffff !important;
}
.mp-elems .mp-div .mp-div-table { position: relative; width: 100%; border-spacing: 0; }
.mp-elems .mp-div .mp-div-img-cell {
	vertical-align: top;
}
.mp-elems .mp-div .mp-div-img {
	position: relative;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	background-origin: padding-box;
	border-radius: 50%;
	margin: 8px;
    box-sizing: border-box;
	width: 60px !important;
    height: 60px !important;
}
.mp-elems .mp-div .mp-div-text-cell {
	position: relative;
	/* font-size: 0.9em;  */
	padding: 8px;
	width: 100%;
	vertical-align: middle;
	overflow: hidden;
}
.mp-elems .mp-div .mp-div-text { position: relative; overflow: hidden; }
.mp-elems .mp-div .mp-div-text-more {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 25%;
	background-image: linear-gradient(0deg, #ffffff 25%, transparent);
}
.mp-elems .mp-div-hl .mp-div-text-more { background-image: linear-gradient(0deg, #def 25%, transparent); }
.mp-elems .mp-div-src .mp-div-text-more { background-image: linear-gradient(0deg, #fed 25%, transparent); }
.mp-elems .mp-item-me { border-color: #060 !important; background-color: #cfc; }
.mp-elems .mp-item-me .mp-div-title { background-color: #040 !important; }
.mp-elems .mp-div .mp-font-icon-cell { text-align:center; padding: 0 0 0 0.5em; }
.mp-elems .mp-div .mp-font-icon { font-size: 1.4em; color: #0080C0; }

.mp-item { position: absolute;}
.mp-item-plain { stroke: #0080C0; fill: url(#MP_ITEM_PLAIN); filter: url(#MP_SHADOW); }
.mp-item-div { position: relative; display: table-cell; vertical-align: middle; left: 0; top: 0; width: inherit; height: inherit; font-size: 1rem; line-height: normal; text-align: center; color: #0080c0; overflow: hidden;  -webkit2: all 300ms ease-in-out; transition: all 300ms ease-in-out;}
.mp-item-div:hover { cursor: pointer; /*-webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1);*/ }
.mp-arrow {
	fill: none;
	fill-color: maroon;
	stroke: #4176ea;/* stroke-dasharray: 1000;  stroke-dashoffset: 1000; animation: dash 2s linear forwards;*/ }


.mp-marker-square { fill: #0080C0; stroke: none; }
.mp-marker-arrow { fill: #0080C0; stroke: none }
.mp-marker-circle { fill: #0080C0; stroke: none }
.mp-map-scale { stroke-width: 1px; stroke: #666; fill: none; stroke-dasharray: 2,4; }

.mp-mask { display: none; }

.mp-item-highlighted { fill: #fc6; }
.mp-div-highlighted {  }
.mp-arrow-highlighted {  }

.mp-switch-circle { stroke: #0080C0; fill: #fff; z-index: 1000; }
.mp-switch-minus { stroke: #0080C0; fill: none; }

.mp-bubble-box {
	display: none;
	z-index: 999;
	position: absolute;
	left: 100px;
	top: 100px;
	width: 324px;
	max-width: 324px;
	height: 216px;
	font-size: 14px;
}
.mp-bubble {
	position: absolute;
	box-sizing: border-box;
	left: 0;
	top: 0;
	width: 32em;
	height: 16em;
	max-width: 32em;
	padding: 8px;
/* 	background-image: -webkit-linear-gradient(90deg, #bdf 5%, #def 100%);
	background-image: -moz-linear-gradient(90deg, #bdf 5%, #def 100%);
	background-image: -ms-linear-gradient(90deg, #bdf 5%, #def 100%);
	background-image: linear-gradient(0deg, #bdf 5%, #def 100%);  */
	border: 1px solid #4176ea;
	box-shadow: 0.2em 0.2em 1em 0 rgba(96,96,96,0.8);
	border-radius: 4px;
	background-color: #ffffff;
}
.mp-bubble .mp-bubble-header {
	font-weight: 600;
	padding-bottom: 8px;
}
.mp-bubble .mp-bubble-table { border-spacing: 0; }
.mp-bubble .mp-bubble-img-cell {
	padding-right: 8px;
}
.mp-bubble-txt-cell{
	width: 100%;
	box-sizing: border-box;
}
.mp-bubble .mp-bubble-text { overflow: auto; }
.mp-bubble-box .mp-bubble-arrow { position: absolute; width: 0; height: 0; border-style: solid; display: none; }
.mp-bubble-box .mp-bubble-arrow-tl { left: -32px; top: 8px; border-width: 0 32px 16px 0; border-color: transparent #0080C0 transparent transparent; }
.mp-bubble-box .mp-bubble-arrow-tr { right: -32px; top: 8px; border-width: 16px 32px 0 0; border-color: #0080C0 transparent transparent transparent; }
.mp-bubble-box .mp-bubble-arrow-bl { left: -32px; bottom: 8px; border-width: 0 0 16px 32px; border-color: transparent transparent #0080C0 transparent; }
.mp-bubble-box .mp-bubble-arrow-br { right: -32px; bottom: 8px; border-width: 16px 0 0 32px; border-color: transparent transparent transparent #0080C0; }

.mp-controls-table { border-spacing: 0; }
.mp-controls-table .mp-control-cell {
	padding: 0.4em;
}
.mp-controls-table .mp-control-btn-svg { position: relative; width: 2em; height: 2em; cursor: pointer;  }
@media screen and (min-width: 968px) { .mp-controls-table .mp-control-btn-svg { width: 1.6em; height: 1.6em; } }

.mp-controls-table .mp-control-btn-path { fill: #999; stroke: none; }
.mp-controls-table .mp-control-btn-svg:hover .mp-control-btn-path { fill: #0080C0 }

.mp-level-border { position: absolute; border-right: solid 1px #999; }
.mp-header { position: absolute; border-bottom: solid 1px #999; }
.mp-level-header { position: absolute; }
.mp-cat-header { position: absolute; background-color: #def; border-right: solid 1px #999; }
.mp-header .mp-header-table { border-spacing: 0; }
.mp-header .mp-header-cell { text-align: center; vertical-align: middle; padding: 0.5em 1em; overflow: hidden;  }

/* lpe tree-map */
.wt-lp-tree-workarea .wt-lp-tree-block .mp-outer .mp-main {
	margin: 0 !important;
}

/*ppm*/
.ppm-main { position: relative; }
.ppm-main .ppm-table { border-spacing: 0; width: 100%; }
.ppm-main .ppm-row-name { position: relative; border-style: none solid none none; border-width: 0 0.3em 0 0; border-color: #0080C0; }
.ppm-main .ppm-col-name { position: relative; border-style: solid none none none; border-width: 0.3em 0 0 0; border-color: #0080C0; }
.ppm-main .ppm-cell { position: relative; border-style: dotted dotted none none; border-width: 0.2em 0.2em 0 0; border-color: #0080C0; vertical-align: middle; text-align: center; }
.ppm-user-div { position: relative; display: inline-block; width: 40px; height: 40px; background-repeat: no-repeat; background-size: cover; border: solid 0.2em #0080C0; border-radius: 50%; margin: 0.2em; box-shadow: 0.1em 0.1em 0.8em rgba(0,0,0,0.6); -webkit2: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
.ppm-user-div:hover { cursor: pointer; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
.ppm-row-name-div { position: absolute; display: inline-block; font-size: 1.5em; color: #0080C0; padding: 0.5em; transform: rotate(-90deg); transform-origin: left bottom; text-align: center; }
.ppm-test-row-name-div { position: relative; display: inline-block; font-size: 1.5em; padding: 0.5em; }
.ppm-axis-y-name { position: relative; }
.ppm-axis-y-name-div { position: absolute; display: inline-block; font-size: 2em; color: #0080C0; padding: 1em; transform: rotate(-90deg); transform-origin: left bottom; text-align: center; }
.ppm-test-axis-y-name-div { position: relative; display: inline-block; font-size: 2em; color: #0080C0; padding: 1em; }
.ppm-col-name-div { position: relative; display: block; font-size: 1.5em; color: #0080C0; padding: 0.5em; text-align: center; }
.ppm-axis-x-name-div { position: relative; display: block; font-size: 2em; color: #0080C0; padding: 1em;  text-align: center;}
.ppm-axis-point { position: absolute; background-color: #0080C0; overflow: hidden; }
.ppm-axis-point-x1 { left: 0; top: 0; width: 0.2em; height: 0.4em; }
.ppm-axis-point-x2 { right: 0; top: 0; width: 0.2em; height: 0.5em; }
.ppm-axis-point-y1 { right: 0; bottom: 0; width: 0.4em; height: 0.2em;}
.ppm-axis-point-y2 { right: 0; top: 0; width: 0.5em; height: 0.2em;}
.ppm-cell-header { position: absolute; width: 100%; height: 3em; padding: 0; left: 0; top: 0; background-color: #eee; }
.ppm-cell-header:hover { background-color: #cdf; cursor: pointer; }
.ppm-header-table { position: relative; width: 100%; height: 3em; border-spacing: 0; }
.ppm-header-img-cell { height: 3em; padding: 0; }
.ppm-header-img { height: 3em; max-height: 3em; }
.ppm-header-title-cell { width: 100%; height: 3em; padding: 1em; text-align: left; font-weight: bold; color: #0080C0; }
.ppm-base-cell { background-color: #fe9; }

.wtx-informer-my-team-list { display: block; width: inherit; height: auto !important; margin: 0; }
.wtx-item-list { list-style: none; margin: 8px 0; padding: 0;}
.wtx-list-item { display: block; padding: 0 24px;}
.wtx-list-item:first-of-type { border-top: none; }
.wtx-list-item:hover { background-color: #f3f3f4; }
.wtx-li-table { width: 100%; border-spacing: 0; }
.wtx-li-table .wtx-li-icon-cell { width: 5em; }
.wtx-li-table .wtx-li-icon-cell-left { padding: 8px}
.wtx-li-table .wtx-li-icon-cell-right { padding: 0 0 0 1em; }
.wtx-li-icon {
/* 	width: 4em; height: 4em; border: solid 1px #0080c0; box-sizing: border-box; border-radius: 50%; background-position: center top; background-repeat: no-repeat; background-size: cover;  */
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-size: cover;
    background-position: center center;
}
.wtx-li-table .wtx-li-info-cell { width: 100%; }
.wtx-li-table .wtx-li-user-name { }
.wtx-li-table .wtx-li-user-position { color: #969eb2; }
.wtx-list-more {
	display: block;
	padding: 16px;
	text-align: center;
	border-top: 1px solid #ebebec;
	cursor: pointer;
}
.wtx-list-total { display: inline-block; background-color: #0080c0; color: #fff; font-size: 1.2em; font-weight: bold; padding: 0.5em 2em; margin: 0 0 0 auto; white-space: nowrap; }
.wtx-list-total:hover { display: inline-block; background-color: #0080c0; color: #fff; font-size: 1.2em; font-weight: bold; padding: 0.5em 2em; margin: 0 0 0 auto; }
.wtx-list-footer { position: relative; border-top: solid 0.05em #0080c0; padding: 0 !important; margin: 0.5em 0 0 0; }

.wttree-container { overflow: auto; }
/*some custom map styles*/
/*view_navigation_panel.xaml*/
.wt-sitemap-item { border-color: #999 !important; }
.wt-sitemap-item > table{ margin: 2px 0 !important; }
.wt-sitemap-item .mp-font-icon-cell { padding: 0 0 0 0.75em !important; }
.wt-sitemap-item.mp-item-level-0 { background-color: #fec !important; }
.wt-sitemap-item .mp-div-text-more { display: none; }


.XAML-indent-0 { width: 0px !important; height: 24px !important; }
.XAML-indent-1 { width: 24px !important; height: 24px !important; }
.XAML-indent-2 { width: 48px !important; height: 24px !important; }

.XAML-grid-list-item-small td { padding: 8px 8px 8px 0 !important; vertical-align: middle !important; }
.XAML-grid-list-item-small td:first-child { padding-left: 8px !important; }

/* ------- End of wt-controls.css ----------- */

.XAML-stack-informer-body .circular-scale-container{
	/* padding-left: 24px;
	padding-top: 8px;
	box-sizing: border-box; */
/* 	height: auto; */
}
.XAML-contscale{
}
/*------------- End of Informers ----------------*/

/*------------ Status Colors  --------*/

.XAML-stack-legend{
	margin: 8px 0;
	font-size: 14px;
	color: #969eb2;
}
.XAML-stack-legend img{
	border-radius: 2px;
}
/* .color-active,
.color-active a{
	background-color: #8ed100 !important;
	color: #FFFFFF;
} */

.color-plan,
.color-plan a{
	background-color: #ffac3e !important;
	color: #FFFFFF;
}

.color-project,
.color-project a{
	background-color: #adb1b9 !important;
	color: #FFFFFF;
}

.color-cancel,
.color-cancel a{
	background-color: #ff606f !important;
	color: #FFFFFF;
}

.color-finish,
.color-finish a{
	background-color: #8c80c8 !important;
	color: #FFFFFF;
}

.color-fail, .color-failed,
.color-fail a, .color-failed a{
	background-color: #ff606f !important;
	color: #FFFFFF;
}

.color-success,
.color-success a{
	background-color: #8ed100 !important;
	color: #FFFFFF;
}
.color-viewed,
.color-viewed a{
	background-color: #8c80c8 !important;
	color: #FFFFFF;
}

.color-process,
.color-process a{
	background-color: #8ed100 !important;
	color: #FFFFFF;
}

.color-archive,
.color-archive a{
	background-color: #fff59b !important;
	color: #FFFFFF;
}

/*--------------------------------*/
.cssXPTabControl-left,
.cssXPTabControl-left>.x-tab-bar,
.cssXPTabControl-left .x-tab-left,
.cssXPTabControl-left>.x-tab-bar .x-box-target,
.cssXPTabControl-left>.x-tab-bar .x-box-inner,
.cssXPTabControl-left>.x-tab-bar .x-tab-bar-body {
	position: relative !important;
	height: auto !important;
}
.cssXPTabControl-left>.x-tab-bar{
	float: left;
}
.cssXPTabControl-left>.x-panel-body{
	left: 0 !important;
    top: 0 !important;
}
.cssXPTabControl-left .x-tab-left{
	top: 0 !important;
	left: 0 !important;
}


.cssXPTabControl-left .x-tab-bar [class^="icon-"] span.x-tab-icon-el-default,
.cssXPTabControl-left .x-tab-bar [class*=" icon-"] span.x-tab-icon-el-default{
	display: none;
}

.cssXPTabControl-top .x-tab-bar [class^="icon-"] span.x-tab-icon-el-default,
.cssXPTabControl-top .x-tab-bar [class*=" icon-"] span.x-tab-icon-el-default{
	display: none;
}

.XAML-stack-block .cssXPTabControl-top .x-tab-bar [class^="icon-"] span.x-tab-icon-el-default,
.XAML-stack-block .cssXPTabControl-top .x-tab-bar [class*=" icon-"] span.x-tab-icon-el-default{
	display: inline;
}

.XAML-tabcontrol-filter>.x-tab-bar{
	z-index: 10;
	border: 1px solid transparent;
	margin: 0 0 8px 0;

}

.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target{
	position: relative;
}

.cssXPTabControl-left .x-tab-bar-vertical .x-tab-inner { width: 170px; }


@media screen and (min-width: 980px){
	.XAML-tabcontrol-filter>.x-tab-bar,
	.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body,
	.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner,
	.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target{
		width: auto !important;
		display: inline-block !important;
		/* min-height: 50px !important */;
		height: auto !important;
	}
}
.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default{
	font-size: 14px;
	color: #313a4a;
	padding-left: 0;
	padding-right: 0;
	/* margin-right: 16px !important; */
}
@media screen and (min-width: 980px){
	.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default{
	position: relative !important;
		top: auto !important;
		left: auto !important;
	}
}
.XAML-tabcontrol-filter>.x-tab-bar>.x-tab-bar-body>.x-box-inner>.x-box-target>.x-tab-default .x-tab-button{
	line-height: normal;
}
.XAML-tabcontrol-filter>.x-panel-body{
	top: 0 !important;
}

/*--------- Диалог выбора файлов -----------*/

.XAML-resource-field {
	padding: 0 0 24px 0;
}

body.desktop .XAML-resource-field .x-form-text-field-body-default { min-width: 395px; max-width: 395px; }

.cssXPResourceFieldDialog { width: 600px; max-width: 600px; height: 50%; }

.cssXPResourceFieldDialog .x-toolbar{
	padding: 16px 16px;
}
.cssXPResourceFieldDialog .x-toolbar .x-btn{
	border: 1px solid #4176ea;
	/* padding: 13px 23px; */
	font-size: 14px;
	padding: 8px 16px;
	border-radius: 2px;
	color: #4176ea;
	cursor: pointer;
	margin: 8px 0 8px 8px ;
}
.cssXPResourceFieldDialog .x-toolbar .x-btn:hover,
.cssXPResourceFieldDialog .x-toolbar .x-btn-pressed{
	border-color: #4176ea;
	background-color: #4176ea;
	color: #FFFFFF;
}
.cssXPResourceFieldDialog .x-form-checkboxgroup{
	padding: 8px 16px 0 16px;
}
.cssXPResourceFieldDialog .x-form-cb-label{
	margin: 8px 0;
}
.cssXPResourceFieldDialog .x-form-checkboxgroup .x-form-item-label, .cssXPResourceFieldDialog .x-form-checkboxgroup .x-form-item-label-inner {
	margin: 8px 0;
    width: 150px !important;
}
.cssXPResourceFieldFormNew .x-panel-body {
	padding: 16px 16px;
}
.cssXPResourceFieldFormNew .x-btn{
	border: 1px solid #c9ccd4;
	background-color: inherit;
	padding: 8px;
	color: #969eb2;
	border-radius: 4;
	min-width: 40px;
	min-height: 40px;
	margin-left: 10px !important;

	box-shadow: inset 0 0 3px #cccccc;
	font-weight: bold;
}

.cssXPResourceFieldFormNew .x-btn:hover{
	border-color: #727a8d;
	background-color: inherit;
	color: #727a8d;
}
/*------------ Paging ----------------*/
.x-toolbar-docked-bottom{
	margin: 8px 0;
}
.x-toolbar-docked-bottom input[type=text]{
	padding: 8px;
	width: 40px;
	height: 40px;
    /* margin: 4px 0; */
}
.x-toolbar-docked-bottom .x-toolbar-default .x-toolbar-item{
	width: 40px;
}
.x-tbar-page-number .x-form-item-body{
	width: 40px !important;
}

.x-toolbar-docked-bottom>.x-box-inner>.x-box-target>*{
/* 	display: inline-block !important;
    position: relative !important;
    left: auto !important;
    top: auto !important; */
}

.x-toolbar-docked-bottom .x-btn{
	display: inline-block;
	border: 1px solid #c9ccd4;
	width: 40px;
	height: 40px;
	color: #969eb2;
	border-radius: 2px;
}
.x-toolbar-docked-bottom .x-btn:hover{
	border-color: #4176ea;
	color: #4176ea;
}
a.cssXPPagingToolbarMenuBtn span.x-btn-icon-el {display: inline-block; background-image: url(icons/svg/icon_list.png); width: 16px; height: 16px;}

/*----------- Индикаторы ------------*/

.XAML-stackpanel { padding: 0 0 24px 0; }
.XAML-stackpanel .x-field { margin: 0px 16px 0px 0px; height: 40px; }
.XAML-stackpanel .indicator_column { margin: 0px 16px 0px 0px; }
.XAML-indicator-panel { margin: 0px 16px 16px 0px; }
.XAML-indicator-fields { margin: 16px 0px }
.XAML-indicator-fields td { padding-right: 16px; }
.XAML-indicator-fields .cssXPButton { margin-bottom: 0px }

/*------------- HTML -----------------*/
ul.simple-list{
	margin: 0;
	padding: 0;
	list-style: none;
}
.filter{
	border: 1px solid #c9ccd4;
	border-radius: 4px;
	margin: 8px 0;
	overflow: auto;
	text-align: right;
}
.filter, .filter input, .filter select{
	font-size: 14px;
}
.filter>div,
.filter>button{
	/* float: right; */
	/* display: inline-block !important; */
	display: inline-block;
	margin: 0 4px;
}
.filter>div:last-child,
.filter>button:last-child{
	padding-right: 24px;
	margin-right: 0;
}
.filter>div:first-child,
.filter>button:first-child{
	padding-left: 24px;
	margin-left: 0;
}
.filter input{
	padding: 4px;
	font-size: 14px;
}
.button-view{
	border: 0;
	font-size: 14px;
	color: #969eb2;
	padding: 16px 8px;
	border-radius: 0;
	margin: 0;
	border-bottom: 2px solid transparent;
}
.button-view:hover, .button-view.active{
	border: 0;
	color: #4176ea;
	border-bottom: 2px solid transparent;
	background-color: inherit;
}
.filter .divider{
	width: 1px;
	height: 16px;
	background: url(design/default/images/buttons-divider.png) center center no-repeat;
	margin: 16px 0;
}

.filter .button-action{
	display: inline-block;
	border: 0;
	font-size: 14px;
	color: #4176ea;
	padding: 16px 8px;
	border-radius: 0;
	margin: 0;
}
.filter .button-action:hover{
	background-color: transparent;
}
.filter .search-container>div{
	display: inline-block;
}
.combo-view{
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	box-sizing: content-box;
	padding: 8px;
	color: #969eb2;
	border: 1px solid transparent;
	background-color: inherit;
	-webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
	margin: 8px 0;
}
.combo-view:focus{
	border: 1px solid #c9ccd4;
	color: #313a4a;
}
.combo-view option{
	padding: 8px 8px;
	background-color: #f3f3f4;
	font-size: 14px;
}
.list-container{
	background-color: #ffffff;
	padding: 24px 24px;
	margin: 0 0 24px 0;
	border-radius: 4px;
}
.list-table, .datagrid{
	width: 100%;
	border-collapse: collapse;
}
.list-table>tbody>tr,
.datagrid>tbody>tr{
	background-color: #f3f3f4;
	margin-bottom: 2px;
}
.list-table>tbody>tr:hover,
.datagrid>tbody>tr:hover{
	background-color: #ebebec;
}

.list-table>tbody>tr>th,
.datagrid>tbody>tr>th{
	color: #969eb2;
	background-color: #f3f3f4;
	margin: 8px 0;
	padding: 16px  8px;
	font-size: 13px;
	font-weight: 400;
	border-bottom: 4px solid #ffffff;
}
.list-table>tbody>tr>td,
.datagrid>tbody>tr>td{
    padding: 16px 8px;
	border-bottom: 1px solid #ffffff;
}
.list-table>tbody>tr>td:first-child,
.datagrid>tbody>tr>td:first-child{
	padding-left: 24px;
}
.list-table>tbody>tr>td:last-child,
.datagrid>tbody>tr>td:last-child{
	padding-right: 24px;
}

.info-table{
	margin: 8px 0;
	/* width: auto !important; */
	border-radius: 4px;
	background-color: #ffffff;
	padding: 24px;
}
table.info-table th {
	color: #969eb2;
	font-size: 14px;
	font-weight: normal;
	vertical-align: middle;
	padding: 8px 16px;
	background-color: #f3f3f4;
	border-bottom: 1px solid #ffffff;
}
.info-table>tbody>tr>td{
	vertical-align: middle;
	padding: 16px;
	background-color: #f3f3f4;
	border-bottom: 1px solid #ffffff;
}
.info-table>tbody>tr>td:first-child{
	width: 192px;
}
.info-table input[type=text]{
	width: 300px;
}

div.access_panel { text-align: center; margin: 50px auto; width: fit-content; }
table.access_table {
	margin: 0 0 24px 0;
	border-radius: 4px;
	background-color: #ffffff;
	padding: 32px;
	overflow-x: auto;
	width: 400px;
	height: 200px;
	font-size: 17px;
}
td.access_txt { padding-top: 24px;  }

/*--------Производственный календарь-------*/

table.production-calendar-header { padding-bottom: 16px }
.production-calendar-footer { font-size: 13px; }

td.legend-left div.weekend { background: url(design/default/images/balloon-icon.png) left top no-repeat; padding: 2px 40px 0px 28px; height: 24px; }
td.legend-left div.workday { background: url(design/default/images/desktop-icon.png) left top no-repeat; padding: 2px 0px 0px 28px; height: 24px; }

td.legend-right div.dayoff { color: #ff606f; float: left; padding-top: 3px; }
td.legend-right div.dayoff-text { padding: 3px 10px 0px 2px; display: inline-block; }
td.legend-right div.holiday { background-color: #ff606f; border-radius: 50%; color: #FFFFFF; width: 24px; height: 24px; text-align: center; padding-top: 3px; float: left; box-sizing: border-box; }
td.legend-right div.holiday-text { padding: 2px 10px 4px 4px; display: inline-block; }
td.legend-right div.preholiday { color: #ff606f; float: left; padding-top: 3px; display: none }
td.legend-right div.preholiday-text::before { content: "*"; color: #4176ea; padding-right: 4px; height: 24px }
td.legend-right div.preholiday-text { padding: 3px 0px 0px 2px; display: inline-block; height: 24px }

div.monthDiv { border-bottom: 1px solid #ebebec; padding: 4px 0px 8px 0px; min-width: 150px; }

div.monthDiv .weekend { background: url(design/default/images/balloon-icon.png) 0px 3px no-repeat; background-size: 16px 16px; padding: 2px 0px 0px 20px; height: 16px; color: #F00; }
div.monthDiv .workday { background: url(design/default/images/desktop-icon.png) 0px 2px no-repeat; background-size: 16px 16px; padding: 2px 4px 0px 20px; height: 16px; }
div.monthDiv .monthName { width: auto; float: left; }
div.monthDiv .monthDays { text-align: right; }

td.monthTD { padding-right: 24px; padding-bottom: 16px; border: 0px solid #F00; }
td.monthTD:nth-child(6) { padding-right: 0px }

div.working-day { width: 24px; height: 24px; text-align: center; vertical-align: middle; display: table-cell; font-size: 14px;  }
div.dayoff { width: 24px; height: 24px; text-align: center; vertical-align: middle; display: table-cell; color: #F00; font-size: 14px; }
div.holiday { background-color: #ff606f; border-radius: 50%; color: #FFFFFF; width: 24px; height: 24px; text-align: center; vertical-align: middle; display: table-cell; font-size: 14px;   }
div.preholiday { width: 24px; height: 24px; text-align: center; vertical-align: middle; display: table-cell; padding-left: 3px; font-size: 14px;  }
div.preholiday::after { content: "*"; color: #4176ea; padding-right: 0px; height: 24px; font-size: 14px; }
div.dayname { padding-right: 10px }

body.mobile td.legend-left div.weekend { padding-right: 0px }
body.mobile td.monthTD { padding-right: 0px; padding-bottom: 24px; }
body.mobile td.monthTD table { margin: 0 auto }

/*-------------- Мои разговоры (виджет) ------------------*/
.widget-my_conversations {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
}

.widget-my_conversations--usual_view {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
}

.widget-my_conversations--simple_view {
	display: none;
	flex-direction: column;
	flex: 1 0 auto;
}

.header .WTCSS-user-info .widget-my_conversations { display: none; }

.widget-my_conversations--mobile_view {
	display: none;
	flex-direction: column;
	flex: 1 0 auto;
}

.header .widget-my_conversations {
	display: inline-block;
	height: 64px;
	box-sizing: border-box;
}
.header .widget-my_conversations--simple_view {
	display: flex;
	cursor: pointer;
	height: 100%;
}

.header .widget-my_conversations--simple_view:hover .widget-my_conversations__icon-container {
	color: #4176ea;
}

.header .widget-my_conversations--usual_view { display: none; }

.widget-my_conversations .widget-my_conversations--simple_view .widget-my_conversations__icon-container {
	position: relative;
	height: 100%;
	transition: all .2s ease-in-out;
}

.widget-my_conversations .widget-my_conversations--simple_view .widget-my_conversations__icon-container .widget-my_conversations__icon {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100%;
	padding: .5rem 1rem;
	box-sizing: border-box;

	font-size: 5rem;
}

.widget-my_conversations .widget-my_conversations--simple_view .widget-my_conversations__icon-container .widget-my_conversations__messages_count {
	display: block;
	position: absolute;
	top: 2.1rem;
	left: 2.2rem;
	width: 2.6rem;
	text-align: center;
	font-weight: 600;
}

.widget-my_conversations .widget-my_conversations--simple_view .widget-my_conversations__icon-container .widget-my_conversations__messages_count:hover {

}

/* .widget-my_conversations .widget-my_conversations--simple_view .widget-my_conversations__icon .icon-message-ico */


.widget-my_conversations .widget-my_conversations__header {
	display: flex;
	flex: 0 0 auto;
	font-family:  'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	font-size: 34px;
	font-weight: 300;
	margin: 0 0 calc(24px - 4px) 0;
	line-height: 1em;
}

.widget-my_conversations .widget-my_conversations__content {
	margin: 0 0 24px 0;
	background-color: #ffffff;
	border-radius: 4px;
	padding: 24px 24px;
}

.widget-my_conversations .widget-my_conversations__content .widget-my_conversations__info {
	text-align: center;
}

.widget-my_conversations .widget-my_conversations__list {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	list-style: none;
	margin: 0;
	padding: 0;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item {
	display: flex;
	flex-direction: row;
	margin-top: 1.5rem;
}
.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item:first-child { margin-top: 0; }

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-left-container {
	display: none;
	flex-direction: column;
	flex: 0 0 auto;
	align-items: center;
	justify-content: flex-start;
	margin-right: 1.5rem;
}
.zone-main .widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-left-container { display: flex; }

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-left-container .conversation__image {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-right-container {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	max-width: 100%;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info {
	display: flex;
	flex-direction: row;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__title {
	display: flex;
	width: 80%;
	margin-right: 1rem;
	flex: 1 0 auto;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__title .conversation-messages__title {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #4176ea;
	text-decoration: none;
}
.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__title .conversation-messages__title:hover {
	cursor: pointer;
	text-decoration: underline;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__count {
	display: flex;
	flex: 0 0 auto;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__count .conversation-messages__count {
	text-align: center;
	align-items: center;
	border-radius: 50%;
	padding: 3px 8px;
	font-size: 13px;
	color: #FFFFFF;
	background-color: #4176ea;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-info .conversation-info__count .conversation-messages__count--invisible {
	visibility: hidden;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-message {
	display: flex;
	flex-direction: column;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-message .conversation-message__text {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	margin: .5rem 0;
}

.widget-my_conversations .widget-my_conversations__list .widget-my_conversations__list-item .conversation-message .conversation-message__date {
	font-size: 13px;
	color: #969eb2;
	text-align: right;
}

.widget-my_conversations .widget-my_conversations__controls {
	display: flex;
	flex-direction: row;
	margin-top: 1.5rem;
	flex: 1 0 auto;
	justify-content: center;
}

/*-------------- Новости ------------------*/

.News-Date { margin: 0px 0px 0px 0px; color: #969eb2; font-size: 14px }
.News-Item { margin: 0px 0px 8px 0px; }
.News-Item td { vertical-align: top }
.News-Item a { color: #313a4a }
.News-Item a:hover { color: #4176ea }
.News-Item .XAML-label-article-title { font-weight: bold; }
.News-Item .XAML-label-article-desc { font-size: 13px }
.News-Item img { margin-right: 16px; cursor: pointer; }

#zone-main .News-Item { margin: 0px 0px 16px 0px; }
#zone-main .News-Date { font-size: 15px; }
#zone-main .News-Item .XAML-label-article-title { font-size: 19px; font-weight: bold; }
#zone-main .News-Item .XAML-label-article-desc { font-size: 15px; }

.news_block .XAML-stack-block { margin-bottom: 0px }

/*-------------- Голосование --------------*/

.WTCSS-poll { margin-bottom: 24px; }
.WTCSS-poll .header { margin: 0px 0px 8px 0px; font-weight: bold; }
.poll-container {
	background-color: #ffffff;
	padding: 16px 24px;
	border-radius: 4px;
	box-sizing: border-box;
	margin-bottom: 24px;
}

.WTCSS-poll input[type=submit] { margin: 16px 0px 0px 0px }

.WTCSS-poll .archive { margin-top: 16px }

.WTCSS-poll-result .result table.result { width: 100% }

.WTCSS-poll-result .result table.result td {
	vertical-align: middle;
	padding: 16px;
	background-color: #f3f3f4;
	border-bottom: 1px solid #ffffff;
}

.WTCSS-poll-result .result table.result td.poll-graph { height: 16px !important; min-width: 150px; padding: 20px 16px 16px 16px; }
.WTCSS-poll-result .result table.result td.poll-graph img { height: 16px !important; }

.WTCSS-poll .poll-start-table { width: 100% }
.WTCSS-poll td.comment { padding-top: 16px; }
.WTCSS-poll textarea { width: 100%; margin: 0px; padding: 8px; border: 1px solid #ebebec; box-sizing: border-box; }

.WTCSS-poll .XAML-grid-list-container .container { margin-bottom:  16px }

.progress.color1 { background-color: #8fd000 }
.progress.color2 { background-color: #ffab3e }
.progress.color3 { background-color: #8c80c8 }
.progress.color4 { background-color: #fe606f }
.progress.color5 { background-color: #969eb1 }
.progress.color6 { background-color: #4176ea }

table.poll-table { width: 100% }
table.poll-start-table td.input-label { width: 100% }

/*-------Последние темы форумов -----------*/

.WTCSS-forum-last .item { padding: 16px; margin-bottom: 1px; background-color: #f3f3f4;  }
.WTCSS-forum-last .msg-date { color: #969eb2; }

/*
.WTCSS-forum-last .msg-forum a { color: #313a4a }
.WTCSS-forum-last .msg-forum a:hover { color: #4176ea }
*/

/*-------------Активность подчиненных-----*/

.XAML-activity-list {
	margin: 0 0 24px 0;
	background-color: #ffffff;
	border-radius: 4px;
	padding: 24px 24px;
}

.XAML-activity-item { padding: 16px 0; }

.XAML-activity-item td { vertical-align: top; }

.XAML_activity_image {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	background-size: cover !important;
	background-position: center center !important;
}
.XAML_activity_background { background-size: cover; background-position: center center; }

.XAML-employee-activity-select { margin: 0; border-bottom: 1px solid #FFF; }
.XAML-employee-activity-select .XAML-button-selector { margin: 0 0 0 8px; }
.XAML-grid-list-item.XAML-employee-activity-select td { vertical-align: middle }
.XAML-grid-list-item.XAML-employee-activity-select .cssXPButton { margin-top: 0px; margin-bottom: 0px; }

/*-------------- Форумы, блоги -------------------*/
.forum .forum-content,
.blog .blog-content{
	background-color: #ffffff;
	padding: 24px 24px;
	margin: 0 0 24px 0;
	border-radius: 4px;
	box-sizing: border-box;
}

.forum-entry,
.blog-entry{
	background-color: #f3f3f4;
	padding: 16px 16px;
	margin-bottom: 2px;
	word-break: normal;
}

.comm-container.blog-entry { padding: 0px; margin-bottom: 0px }

.forum-entry .message-header,
.blog-entry .message-header{
	padding: 0 0 8px 0;
}
.forum-entry .message-header>div,
.blog-entry .message-header>div,
.gaming .user-info-container>*,
.blog .user-info-container>*{
	display: table-cell;
    vertical-align: middle;
	padding-left: 8px;
    box-sizing: border-box;
	color: #969eb2;
	font-size: 13px;
}
.forum-entry .message-header>div:first-child,
.blog-entry .message-header>div:first-child,
.blog .user-info-container>*:first-child
{
	padding-left: 0;
}

.forum-entry .message-header .user-status-block {
	display: inline;
	background-color: #969eb2;
	margin: 4px;
	padding: 4px;
	border-radius: 2px;
	color: #FFF;
}

.forum .user-info-container,
.blog .user-info-container,
.gaming .user-info-container{
	margin: 8px 0;
}
.forum-entry .message-header .user-name,
.blog-entry .message-header .user-name{
	font-size: 14px;
}
.blog .authors-container>*{
	display: inline-block;
	margin-right: 8px;
	vertical-align: middle;
}
.blog .authors-container{
	margin: 8px 0;
}

.blog .toolbar { margin: 0 0 24px 0; }
.blog .toolbar button, .message-editor .btn-container button { margin: 0 8px 0 0; }

.blog-container .filter { padding: 8px }

.avatar-small,
.forum-entry .avatar,
.blog .avatar,
.gaming .avatar{
/* 	display: block; */
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-size: cover;
	background-position: center center;
}

.user-info-line{
	display: table;
}

.user-info-line>*{
	display: table-cell;
	vertical-align: middle;
}

.user-info-line>.user-name{
	font-size: 14px;
	padding-left: 8px;
}
.blog-entry div.tags{
	display: block;
	margin: 8px 0 0 0;
	padding-left: 0;
}
.forum-entry .message-content,
.blog-entry .message-content{
	clear: both;
}
.forum-entry .message-text,
.blog-entry .message-text{
	margin: 8px 0 8px 48px;
}

.forum-content .indent-1{
	margin-left: 48px;
}
.forum-content .indent-2{
	margin-left: 96px;
}

.forum-content .indent-3{
	margin-left: 144px;
}

.forum-content .indent-4{
	margin-left: 192px;
}
.forum .link-toolbar,
.blog .link-toolbar{
	padding: 8px 0;
	text-align: right;
	font-size: 14px;
}
.forum .link-toolbar a,
.blog .link-toolbar a{
	display: inline-block;
    vertical-align: middle;
	margin-left: 8px;
}
.forum-entry blockquote,
.blog-entry blockquote {
	margin: 8px 0;
    padding: 8px;
    border: solid 1px #c9ccd4;
    background-color: #ebebec;
	border-radius: 2px;
}
.forum .message-editor,
.blog .message-editor{
	background-color: #ffffff;
    padding: 24px;
	margin: 0 0 24px 0;
    border-radius: 4px;
}
.message-editor .info-table{
	padding: 0;
	margin: 0;
}
.message-editor .info-table input[type=text]{
	width: 100%;
    box-sizing: border-box;
}
@media screen and (max-width: 767px) {
	.blog-container .message-editor { padding: 2px; margin: 0;  }
	.blog-container .message-editor .info-table tr { display: block; }
	.blog-container .message-editor .info-table tr > td { display: block; width: auto; padding: 8px; }
	.blog-container .message-editor .info-table tr > td:first-child { border-bottom: none; padding-bottom: 0; }
}

.blog-entry .msg-edit, .blog-entry .msg-link { margin: 0 8px 0 0; }
.blog-entry .msg-content { margin: 8px 0 0 0; }

.blog-entry .msg-edit-link, .blog-entry .msg-delete-link { color: #4176ea; font-size: 13px; padding: 8px 8px 8px 0; cursor: pointer; }

.message-editor .btn-container { margin: 16px 0 0 0 }

.forum .message-editor .subject-icon-selector,
.forum .message-editor .message-editor-container,
.forum .message-editor .attach-select{
	display: none;
}
.forum .message-editor .subject-icon{
	/* position: absolute; */
    margin: 0;
    cursor: pointer;
	padding: 4px;
    margin: 0;
}
.forum .message-editor .subject-icon li{
	list-style: none;
    padding: 0;
    margin: 0;
	position: relative;
}
.forum .message-editor .subject-icon:hover .subject-icon-selector{
	display: block !important;
    z-index: 1000 !important;
     position: absolute;
/*    top: 22px;
    left: 0px; */
	background-color: #ffffff;
    padding: 4px;
	border: 1px solid #c9ccd4;
}
.forum .icons-table td{
    padding: 4px;
}

.forum .cell-actions { white-space: nowrap; }
.forum .actions-container { white-space: nowrap; }
.forum .action-delete { float: right; margin-left: 4px; width: 16px; height: 16px; background-position: center center; background-size: contain; background-repeat: no-repeat; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20style%3D%22fill%3A%23969eb2%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M704%201376v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm256%200v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm256%200v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm-544-992h448l-48-117q-7-9-17-11h-317q-10%202-17%2011zm928%2032v64q0%2014-9%2023t-23%209h-96v948q0%2083-47%20143.5t-113%2060.5h-832q-66%200-113-58.5t-47-141.5v-952h-96q-14%200-23-9t-9-23v-64q0-14%209-23t23-9h309l70-167q15-37%2054-63t79-26h320q40%200%2079%2026t54%2063l70%20167h309q14%200%2023%209t9%2023z%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .action-delete:hover { cursor: pointer; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20style%3D%22fill%3A%234176ea%22%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M704%201376v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm256%200v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm256%200v-704q0-14-9-23t-23-9h-64q-14%200-23%209t-9%2023v704q0%2014%209%2023t23%209h64q14%200%2023-9t9-23zm-544-992h448l-48-117q-7-9-17-11h-317q-10%202-17%2011zm928%2032v64q0%2014-9%2023t-23%209h-96v948q0%2083-47%20143.5t-113%2060.5h-832q-66%200-113-58.5t-47-141.5v-952h-96q-14%200-23-9t-9-23v-64q0-14%209-23t23-9h309l70-167q15-37%2054-63t79-26h320q40%200%2079%2026t54%2063l70%20167h309q14%200%2023%209t9%2023z%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .action-edit { float: right; margin-left: 4px; width: 16px; height: 16px; background-position: center center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22stroke%3A%23969eb2%3Bfill%3Anone%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-width%3A2%3B%22%3E%3Cpath%20d%3D%22M20%2014.66V20a2%202%200%200%201-2%202H4a2%202%200%200%201-2-2V6a2%202%200%200%201%202-2h5.34%22%20%2F%3E%3Cpolygon%20points%3D%2218%202%2022%206%2012%2016%208%2016%208%2012%2018%202%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .action-edit:hover { cursor: pointer; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22stroke%3A%234176ea%3Bfill%3Anone%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-width%3A2%3B%22%3E%3Cpath%20d%3D%22M20%2014.66V20a2%202%200%200%201-2%202H4a2%202%200%200%201-2-2V6a2%202%200%200%201%202-2h5.34%22%20%2F%3E%3Cpolygon%20points%3D%2218%202%2022%206%2012%2016%208%2016%208%2012%2018%202%22%20%2F%3E%3C%2Fsvg%3E');  }
.forum .action-close { float: right; margin-left: 4px; width: 16px; height: 16px; background-position: center center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23969eb2%22%3E%3Cpath%20d%3D%22M1376%20768q40%200%2068%2028t28%2068v576q0%2040-28%2068t-68%2028h-960q-40%200-68-28t-28-68v-576q0-40%2028-68t68-28h32v-320q0-185%20131.5-316.5t316.5-131.5%20316.5%20131.5%20131.5%20316.5q0%2026-19%2045t-45%2019h-64q-26%200-45-19t-19-45q0-106-75-181t-181-75-181%2075-75%20181v320h736z%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .action-close:hover { cursor: pointer; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%234176ea%22%3E%3Cpath%20d%3D%22M640%20768h512v-192q0-106-75-181t-181-75-181%2075-75%20181v192zm832%2096v576q0%2040-28%2068t-68%2028h-960q-40%200-68-28t-28-68v-576q0-40%2028-68t68-28h32v-192q0-184%20132-316t316-132%20316%20132%20132%20316v192h32q40%200%2068%2028t28%2068z%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .icon-closed { float: right; margin-left: 4px; width: 16px; height: 16px; background-position: center center; background-repeat: no-repeat; background-size: contain; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%201792%201792%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%234176ea%22%3E%3Cpath%20d%3D%22M640%20768h512v-192q0-106-75-181t-181-75-181%2075-75%20181v192zm832%2096v576q0%2040-28%2068t-68%2028h-960q-40%200-68-28t-28-68v-576q0-40%2028-68t68-28h32v-192q0-184%20132-316t316-132%20316%20132%20132%20316v192h32q40%200%2068%2028t28%2068z%22%20%2F%3E%3C%2Fsvg%3E'); }
.forum .pinned .pin { width: 16px; height: 16px; background-position: center center; background-repeat: no-repeat; background-size: contain; font-size: 32px; overflow: hidden; background-image: url('data:image/svg+xml;charset=utf-8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%234176ea%22%3E%3Cpath%20d%3D%22M16.729%2C4.271c-0.389-0.391-1.021-0.393-1.414-0.004c-0.104%2C0.104-0.176%2C0.227-0.225%2C0.355%20c-0.832%2C1.736-1.748%2C2.715-2.904%2C3.293C10.889%2C8.555%2C9.4%2C9%2C7%2C9C6.87%2C9%2C6.74%2C9.025%2C6.618%2C9.076C6.373%2C9.178%2C6.179%2C9.373%2C6.077%2C9.617%20c-0.101%2C0.244-0.101%2C0.52%2C0%2C0.764c0.051%2C0.123%2C0.124%2C0.234%2C0.217%2C0.326l3.243%2C3.243L5%2C20l6.05-4.537l3.242%2C3.242%20c0.092%2C0.094%2C0.203%2C0.166%2C0.326%2C0.217C14.74%2C18.973%2C14.87%2C19%2C15%2C19s0.26-0.027%2C0.382-0.078c0.245-0.102%2C0.44-0.295%2C0.541-0.541%20C15.974%2C18.26%2C16%2C18.129%2C16%2C18c0-2.4%2C0.444-3.889%2C1.083-5.166c0.577-1.156%2C1.556-2.072%2C3.293-2.904%20c0.129-0.049%2C0.251-0.121%2C0.354-0.225c0.389-0.393%2C0.387-1.025-0.004-1.414L16.729%2C4.271z%22%20%2F%3E%3C%2Fsvg%3E'); }

.message-editor>table>tbody>tr>td{
	padding: 8px;
}
.forum .message-editor .subject-title {
    vertical-align: middle !important;
    padding: 4px;
    text-align: right;
    white-space: nowrap;
}

.forum .message-editor input.subject {
	box-sizing: border-box;
    width: 100%;
    margin: 0px;
}
.message-editor .text-editor,
.message-editor .text-editor {
    box-sizing: border-box;
	width: 100%;
    height: 200px;
}
.forum .message-editor .main{
	text-align: right;
}
.forum .message-editor .subject-main,
.forum .message-editor .fake-input>table,
.forum .message-editor .fake-input>table>tbody>tr>td:last-child{
    box-sizing: border-box;
	width: 100%;
}
.message-editor .subject-service{
	vertical-align: middle;
    padding: 8px;
	width: 100%;
}
.message-editor .subject-service .service-body{
	text-align: center
}

.message-editor .attach-select {
    position: absolute;
    display: none;
    width: 220px;
    text-align: left;
    border: 1px solid #c9ccd4;
}
.message-editor .attach-select ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.message-editor .attach-select li.pseudo-menu-item {
    background-color: #fff;
    padding: 5px 10px 5px 25px;
    color: #666;
    font-size: 1em;
    cursor: pointer;
}
.message-editor .attach-select li.li-target-resource {
    background-image: url(icons/16round/16_link_0.png);
    background-position: 4px center;
    background-repeat: no-repeat;
}
.message-editor .attach-select li.li-target-file {
    background-image: url(icons/16round/16_save_0.png);
    background-position: 4px center;
    background-repeat: no-repeat;
}
.message-editor .attachments .att-list,
.msg-content .att-list{
    list-style: none;
    padding: 0;
}
.msg-content .file-title,
.msg-content .att-list li{
	float: left;
	margin-right: 8px;
	font-size: 14px;
}
.msg-content .file-title{
	color: #969eb2;
}
.message-editor .attachments{
	list-style: none;
	padding: 0;
}
.message-editor .attachments li {
	text-align: left;
	background-position: 8px center;
	background-repeat: no-repeat;
	background-color: #ebebec;
    margin: 4px 0;
    padding: 16px 16px 16px 32px;
	border-radius: 2px;
}
.message-editor .attachments li input.input-file { width: 320px; height: 24px;  }
.message-editor .attachments li.li-has-value input.input-file { width: 1px; height: 1px; visibility: hidden; }
.message-editor .attachments li.li-removed span.attachment-path { text-decoration: line-through; }
.message-editor .attachments li span.attachment-delete {  display: inline-block; float:right; width: 16px; height: 16px; overflow: hidden; margin: 0 0 -3px 6px; cursor: pointer; background-image: url(icons/16round/16_delete_0.png); background-position: center center; background-repeat: no-repeat; }
.message-editor .attachments li span.attachment-delete:hover { background-image: url(icons/16round/16_delete_1.png);  }
.message-editor .attachments li.li-removed span.attachment-delete { display: none; }
.message-editor .attachments li.li-removed span.attachment-restore { display: inline-block; float: right; width: 16px; height: 16px; overflow: hidden; margin: 0 0 -3px 6px; cursor: pointer; background-image: url(icons/16round/16_undo_0.png); background-position: center center; background-repeat: no-repeat; }
.message-editor .attachments li.li-removed span.attachment-restore:hover { background-image: url(icons/16round/16_undo_1.png);  }
.message-editor .attachments li span.attachment-restore { display: none; }
.message-editor .attachments li.li-in-process { visibility: hidden; }
.message-editor .attachments li.li-img { background-image: url(icons/file_types/16/16_img.png); }
.message-editor .attachments li.li-doc { background-image: url(icons/file_types/16/16_doc.png); }
.message-editor .attachments li.li-xls { background-image: url(icons/file_types/16/16_xls.png); }
.message-editor .attachments li.li-ppt { background-image: url(icons/file_types/16/16_ppt.png); }
.message-editor .attachments li.li-pdf { background-image: url(icons/file_types/16/16_pdf.png); }
.message-editor .attachments li.li-audio { background-image: url(icons/file_types/16/16_audio.png); }
.message-editor .attachments li.li-video { background-image: url(icons/file_types/16/16_video.png); }
.message-editor .attachments li.li-archive { background-image: url(icons/file_types/16/16_archive.png); }
.message-editor .attachments li.li-text { background-image: url(icons/file_types/16/16_text.png); }
.message-editor .attachments li.li-file { background-image: url(icons/file_types/16/16_file.png); }

.msg-options .container>div {
    display: inline-block;
    margin: 8px;
}

.comments-count-icon{
	float: left;
	background: url(design/default/images/social.png) -160px center no-repeat;
	width: 40px !important;
	height: 40px !important;
}
.comments-count-icon:hover{
	background: url(design/default/images/social.png) -200px center no-repeat;
}
.comments-count-value{
	display: block;
	float: left;
	background-color: #4176ea;
    width: 24px;
    padding: 4px 0;
    border-radius: 50%;
    color: #FFFFFF;
    text-align: center;
    font-size: 13px;
	margin: 8px 0 8px -8px;
}

body.mobile #th-author-info, body.mobile #th-last-create-date, body.mobile #th-additional, body.mobile #th-cell-num { display: none }
body.mobile #td-cell-num, body.mobile #td-cell-author, body.mobile #td-cell-updates, body.mobile #td-cell-action { display: none }
body.mobile #td-cell-entries { text-align: center }
body.mobile .forum .forum-content, body.mobile .blog .blog-content { padding: 8px 8px; }
body.mobile .forum-entry, body.mobile .blog-entry { padding: 8px 8px; }
body.mobile .list-container { padding: 8px 8px; }
body.mobile .forum-entry .message-header>div, body.mobile .blog-entry .message-header>div, body.mobile .gaming .user-info-container>*, body.mobile .blog .user-info-container>*{ padding-left: 0px }

/*------------ Dialog HTML -------------*/

.ui-widget-header {
	background-color: #f3f3f4 !important;
	border: 0px solid transparent !important;
	background-image: none !important;
	border-bottom-left-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}

.ui-widget-content .button-view { border: 0px solid transparent; box-shadow: none }

.ui-widget-overlay{
	background-color: rgba(142, 142, 143, 0.6);
	opacity: 1;
}
.ui-dialog {
	background-color: #ffffff;
	border: 0;
	font-size: 15px;
	border-radius: 4px;
	z-index: 40000;
}
.ui-dialog-titlebar{
	padding: 16px;
	border: 0;
	border-bottom: 1px solid #c9ccd4;
	border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
	background-color: inherit;
    background-image: none;
}
.ui-dialog-title{
	font-size: 17px;
	text-align: center;
	display: block;
	font-weight: 400;
}
.ui-dialog-titlebar-close{
	position: absolute;
    right: 0;
	top: 0;
	margin: 16px;
	background-color: inherit !important;
	border: 0 !important;
}
.ui-icon-closethick{
	display: block;
	width: 16px;
	height: 16px;
	background: url(design/default/images/close.png) 0 center no-repeat !important;
	background-color: inherit !important;
}
.ui-widget-content { border: 0px solid transparent !important; }
.ui-widget-content.ui-datepicker { border: solid 1px #c2c3c4 !important; border-radius: 0.5em; padding: 0;  }
.ui-widget-content.ui-datepicker .ui-datepicker-header { display: flex; flex-direction: row; align-items: center; justify-content: center; background-color: transparent !important; padding: 0; margin: 0.5em 1em 0 1.5em;  }
.ui-widget-content.ui-datepicker .ui-datepicker-title { flex-grow: 1; position: relative; left: auto; top: auto; order: 1;  font-size: 1em;  margin: 0 1em 0 0; text-align: left; }
.ui-widget-content.ui-datepicker .ui-datepicker-title span { font-family: Inter, Roboto, sans-serif !important; font-weight: 600; color: #151D2D; }
.ui-widget-content.ui-datepicker .ui-datepicker-prev { position: relative; left: auto; top: auto; width: 2.5em; height: 2.5em; min-width: 2.5em; min-height: 2.5em; margin: 0; order: 2; background-size: 1.5em 1.5em; background-repeat: no-repeat; background-position: center center; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23151D2D%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9.29277%2018.7071C9.6833%2019.0976%2010.3165%2019.0976%2010.707%2018.7071C11.0975%2018.3166%2011.0975%2017.6834%2010.707%2017.2929L6.41409%2013L20.9999%2013C21.5522%2013%2021.9999%2012.5523%2021.9999%2012C21.9999%2011.4477%2021.5522%2011%2020.9999%2011L6.41409%2011L10.707%206.70711C11.0975%206.31658%2011.0975%205.68342%2010.707%205.29289C10.3165%204.90237%209.68329%204.90237%209.29277%205.29289L3.29425%2011.2914L3.29277%2011.2929M3.29131%2011.2944L2.58566%2012L3.29277%2012.7071L9.29277%2018.7071%22%2F%3E%3C%2Fsvg%3E');  }
.ui-widget-content.ui-datepicker .ui-datepicker-next { position: relative; left: auto; top: auto; width: 2.5em; height: 2.5em; min-width: 2.5em; min-height: 2.5em; margin: 0; order: 3; background-size: 1.5em 1.5em; background-repeat: no-repeat; background-position: center center; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23151D2D%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.7071%205.29289C14.3166%204.90237%2013.6834%204.90237%2013.2929%205.29289C12.9024%205.68342%2012.9024%206.31658%2013.2929%206.70711L17.5858%2011H3C2.44772%2011%202%2011.4477%202%2012C2%2012.5523%202.44772%2013%203%2013H17.5858L13.2929%2017.2929C12.9024%2017.6834%2012.9024%2018.3166%2013.2929%2018.7071C13.6834%2019.0976%2014.3166%2019.0976%2014.7071%2018.7071L20.7071%2012.7071L21.4142%2012L20.7074%2011.2932C20.7072%2011.2929%2020.707%2011.2927%2020.7067%2011.2925M14.7071%205.29289L20.7067%2011.2925L14.7071%205.29289Z%22%2F%3E%3C%2Fsvg%3E'); }
.ui-widget-content.ui-datepicker .ui-datepicker-prev:hover { cursor: pointer; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23355bbb%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M9.29277%2018.7071C9.6833%2019.0976%2010.3165%2019.0976%2010.707%2018.7071C11.0975%2018.3166%2011.0975%2017.6834%2010.707%2017.2929L6.41409%2013L20.9999%2013C21.5522%2013%2021.9999%2012.5523%2021.9999%2012C21.9999%2011.4477%2021.5522%2011%2020.9999%2011L6.41409%2011L10.707%206.70711C11.0975%206.31658%2011.0975%205.68342%2010.707%205.29289C10.3165%204.90237%209.68329%204.90237%209.29277%205.29289L3.29425%2011.2914L3.29277%2011.2929M3.29131%2011.2944L2.58566%2012L3.29277%2012.7071L9.29277%2018.7071%22%2F%3E%3C%2Fsvg%3E');  }
.ui-widget-content.ui-datepicker .ui-datepicker-next:hover { cursor: pointer; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23355bbb%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.7071%205.29289C14.3166%204.90237%2013.6834%204.90237%2013.2929%205.29289C12.9024%205.68342%2012.9024%206.31658%2013.2929%206.70711L17.5858%2011H3C2.44772%2011%202%2011.4477%202%2012C2%2012.5523%202.44772%2013%203%2013H17.5858L13.2929%2017.2929C12.9024%2017.6834%2012.9024%2018.3166%2013.2929%2018.7071C13.6834%2019.0976%2014.3166%2019.0976%2014.7071%2018.7071L20.7071%2012.7071L21.4142%2012L20.7074%2011.2932C20.7072%2011.2929%2020.707%2011.2927%2020.7067%2011.2925M14.7071%205.29289L20.7067%2011.2925L14.7071%205.29289Z%22%2F%3E%3C%2Fsvg%3E'); }
.ui-widget-content.ui-datepicker .ui-datepicker-next-hover { right:auto; }
.ui-widget-content.ui-datepicker .ui-datepicker-prev .ui-icon, .ui-widget-content.ui-datepicker .ui-datepicker-next .ui-icon { display: none;  }
.ui-widget-content.ui-datepicker .ui-datepicker-prev.ui-state-hover, .ui-widget-content.ui-datepicker .ui-datepicker-next.ui-state-hover { border: none; background-color: transparent; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar { width: calc(100% - 3em); margin: 0 auto 1.5em auto; font-family: Inter, Roboto, sans-serif !important; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar th { border-bottom: solid 1px #ebebec; font-size: 0.75em; color: #969EB2; text-transform: uppercase; font-weight: normal; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar td { padding: 0; border: solid transparent 1px; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar > tbody tr:first-of-type td { padding-top: 0.5em; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a { flex-grow: 1; flex-shrink: 1; flex-basis: 0; text-align: center; justify-content: center; display: flex; align-items: center; border-radius: 50%; padding: 0.5em; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a:before { content: ""; display: block; padding-top: 100%; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a.ui-state-default { border: none !important; background-color: transparent !important; font-family: Inter, Roboto, sans-serif !important; color: #151D2D !important; text-align: center; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a.ui-state-hover { background-color: #4176ea !important; color: #fff !important; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a.ui-state-highlight { background-color: #f2f3f4 !important; color: #151D2D !important; }
.ui-widget-content.ui-datepicker .ui-datepicker-calendar a.ui-state-active { background-color: #355bbb !important; color: #fff !important; }


.ui-widget-content .list-container { padding: 16px  16px; }
.ui-dialog-content{ border: 0; }
.ui-dialog .filter{
	margin: 0;
	padding: 8px;
	border: 0px solid transparent;
	border-bottom: 1px solid #c9ccd4;
	border-radius: 0px;
}

.ui-dialog .filter>div:last-child { padding-right: 0px }

.ui-dialog .toolbar{
	padding: 8px 16px;
	border-top: 1px solid #c9ccd4;
	border-bottom: 1px solid #c9ccd4;
}
.ui-dialog .toolbar>div{
	display: inline-block;
}

.dialog-buttons{
	padding: 8px 16px;
	border-top: 1px solid #c9ccd4;
	text-align: right;
}
.dialog-buttons button{
	margin-left: 4px;
}
.cke_chrome{
	box-shadow: none !important;
}

.ui-widget .inputButton {

	border-color: #4176ea;
	background-color: #FFFFFF;
	color: #4176ea;
	box-shadow: none;
	font-size: 15px;
	font-weight: normal;
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
}

.ui-widget .inputButtonOver {

	border-color: #4176ea;
	background-color: #4176ea;
	color: #FFFFFF;
	box-shadow: none;
	font-size: 15px;
	font-weight: normal;
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
}

.ui-dialog-content table { border-spacing: 0px }

.ui-dialog-content .tableHeaderNoText { display: none }
.ui-dialog-content .tableHeaderText  { display: none }
.ui-dialog-content .tableHeaderWithText {
	background-color: #f3f3f4;
	color: #969eb2;
	font-size: 13px;
	padding: 8px;
	border-bottom: 3px solid #FFFFFF;
}
.ui-dialog-content .tableHeaderWithText a { color: #969eb2; }

.ui-dialog-content .tableRowEven, .ui-dialog-content .tableRowOdd {
	background-color: #f3f3f4;
	color: #313a4a;
	padding: 8px;
	border-bottom: 1px solid #FFFFFF;
	font-size: 14px;
}

.ui-dialog-content .tableFooter { display: none }

/*------------ Tables HTML -------------*/
.datagrid{
}
.datagrid-header{
	box-sizing: border-box;
}

.datagrid-header>tbody>tr>th{
	color: #969eb2;
	background-color: #f3f3f4;
	margin: 8px 0;
	padding: 16px  8px;
	font-size: 13px;
	font-weight: 400;
	border-bottom: 4px solid #ffffff;
}
/* .datagrid-header  */.no-data{
    text-align: center;
	padding: 16px;
}
.paging{
	margin: 8px 0;
}
.paging .page-link{
	display: inline-block;
	border: 1px solid #c9ccd4;
	padding: 4px 8px;
	background-color: #ffffff;
	color: #969eb2;
	border-radius: 2px;
}
.paging .page-link:hover{
	border-color: #4176ea;
	color: #4176ea;
}
.paging .page-divider{
	display: none;
}
.paging .page-current{
	display: inline-block;
	border: 1px solid #4176ea;
	padding: 4px 8px;
	background-color: #4176ea;
	color: #FFFFFF;
	border-radius: 2px;
}

.tableRowEven, .tableRowOdd {
	background-color: #f3f3f4;
	color: #313a4a;
	padding: 8px;
	border-bottom: 1px solid #FFFFFF;
	font-size: 14px;
}

/*---------- Панель навигации -------------*/

table.navigationTable {
	border: 1px solid #c9ccd4;
	border-radius: 4px;
	padding: 24px;
	box-sizing: border-box;
	margin-bottom: 24px;
}

table.navigationTable td.selectedLeftMenuItem { color: #4176ea;  padding-bottom: 16px; }
table.navigationTable td.nonselectedLeftMenuItem { padding-bottom: 16px; }
table.navigationTable tr:last-child td.nonselectedLeftMenuItem, table.navigationTable tr:last-child td.selectedLeftMenuItem { padding-bottom: 0px }
table.navigationTable a { color: #313a4a; }
table.navigationTable a:hover { color: #4176ea; }

/*------------ Геймификация ---------------*/

.XAML-game-panel { background-color: #FFFFFF; border-radius: 4px;  margin:  0 0 24px 0; }
.XAML-game-block { padding: 24px 24px; border-bottom: 1px solid #f3f3f4; }
.XAML-game-block .XAML-label-header-2 { margin-bottom: 0px }

.XAML-game-panel .XAML-tileview-list { padding: 0; margin: 0;  border-radius: 0; background-color: transparent; }
.XAML-game-panel .spxmltileview { width: 100% !important; margin-left: 0 }
.XAML-game-panel .spxmltileview-tile {}
.XAML-game-panel .spxmltileview .spxmltileview-tile:last-child>table>tbody>tr:last-child {border-bottom: 0px }

.XAML-game-panel .XAML-tileview-list .XAML-grid-list-item>table>tbody>tr>td:first-child { padding-left: 24px }
.XAML-game-panel .XAML-tileview-list .XAML-grid-list-item>table>tbody>tr>td:last-child { padding-right: 24px }
.XAML-game-panel .wt-paging-toolbar { padding: 16px 24px; }

.XAML-game-list-item { padding: 8px 24px; margin-bottom: 0px; }
.XAML-game-list-item:hover { background-color: #f3f3f4; cursor: pointer; }
.XAML-game-list-item .XAML-image-tile-image { border-radius: 24px }

.XAML-game-list-items { padding: 16px 24px; margin-bottom: 0px; border-bottom: 1px solid #f3f3f4; }
.XAML-game-list-items:hover { background-color: #f3f3f4; cursor: pointer; }
.XAML-game-list-items .XAML-stack-tile-image-container { margin-right: 16px; }

.XAML-game-list-item a.person-name { color: #313a4a; padding-top: 4px; font-size: 15px; display: block; }
.XAML-game-list-item:hover a.person-name { color: #4176ea; }
.XAML-game-list-item .person-level { color: #313a4a; font-size: 13px; }
.XAML-game-list-item .person-position { color: #969eb2; font-size: 13px; padding-top: 8px; }

.XAML-game-list-all { padding: 8px 24px 16px 24px; display: block; }

.XAML-game-grid-header { font-size: 13px; color: #969eb2; }

.my-position { background-color: #313a4a; color: #FFF;  }
.my-position:hover { background-color: #727a8d; color: #FFF;  }
.my-position a { color: #FFF }

.high-position { background-color: #4176ea; color: #FFF; }
.high-position:hover { background-color: #355bbb; color: #FFF; }
.high-position a { color: #FFF }

.standart-position {  }

.XAML-grid-list-item.my-position td, .XAML-grid-list-item.standart-position td, .XAML-grid-list-item.high-position td, .XAML-game-grid-header td { vertical-align: middle; }
.XAML-grid-list-item.my-position img, .XAML-grid-list-item.standart-position img, .XAML-grid-list-item.high-position img { border-radius: 16px; margin-right: 10px; }

.leader .x-toolbar-docked-bottom { margin: 24px 0 0 0; }
.leader .xaml-tileview-fixed-width-layout.spxmltileview { width: 100% !important; margin-left: 0; }

.XAML-game-desc { padding: 24px 24px 0 24px; }

/* Game score dialog */
.wt-gd {  }
.wt-gd-mobile {}
.wt-gd-header { }
.wt-gd-person-selector-container {
	margin: 8px 24px;
}
.wt-gd-person-selector-fld {
	width: 100%;
	box-sizing: border-box;
}
/* .wt-gd-person-selector-dropdown { display: none; z-index: 100; position: absolute; max-height: 200px; overflow: auto; border: solid 1px #999;  } */
.wt-gd-person-selector-searching { display: none !important; }
.wt-gd-person-selector-no-match {
	display: none;
	text-align: center;
	margin: 8px;
}
.wt-gd-person-selector-match-list { display: none;}
.wt-gd-person-selector-match-item {
	padding: 8px;
	color: #666;
	text-align: left;
	background-color: #ffffff;
	border: 1px solid #c9ccd4;
	border-top: 0;
}
.wt-gd-person-selector-match-item:hover { cursor: pointer; color: #000; background-color: #eee; }
.wt-gd-person-selector-match-item-selected { color: #000; background-color: #eee; }
.wt-gd-score-block {
	margin: 8px 24px;
}
.wt-gd-score-table { width: 100%; border-spacing: 0; }
.wt-gd-score-table-left  {
	width: 50%;
	vertical-align: top;
	box-sizing: border-box;
}
.wt-gd-score-table-right{
	width: 50%;
	padding-left: 8px;
	vertical-align: top;
	box-sizing: border-box;
}
.wt-gd-score-comment-container {}
.wt-gd-score-comment {
	width: 100%;
	box-sizing: border-box;
	min-height: 120px;
	resize: none;
}
.wt-gd-score-selector-container { position: relative; margin: 10px 0; }
.wt-gd-score-selector-table { border-spacing: 0; }
.wt-gd-score-selector-left { padding: 5px 0; text-align: right; }
.wt-gd-score-selector-fld { padding: 5px; text-align: left; }
.wt-gd-score-selector-right { padding: 5px 0; text-align: left; width: 100%; }
.wt-gd-score-selector-right-2 { padding: 5px; text-align: left; width: 100%; }
.wt-gd-score-qty { font-size: 1em; width: 2em; height: 1.8em; text-align: center; }
.wt-gd-score-thank { margin: 0 10px 0 0; color: #060; }
.wt-gd-competence-list { position: relative; list-style: none; margin: 0; padding: 0; }
.wt-gd-competence-item { padding: 5px 10px 5px 0; }
.wt-gd-competence-item-table { border-spacing: 0; }
.wt-gd-competence-item-cell-radio { vertical-align: top; padding: 0 5px 0 0; }
.wt-gd-competence-item-cell-name { vertical-align: top; padding: 0; }
.wt-gd-competence-description {
	display: none;
	margin: 8px 24px;
	padding: 8px;
	background-color: #f3f3f4;
	border-radius: 2px;
}

.gaming .informer{
	height: auto;
}
.gaming .informer-header{
	font-size: 15px;
}
.gaming .informer-content{
	font-size: 14px;
}
.toolbar-bottom{
	text-align: right;
	margin: 8px 24px;
}

/*--------- Command styles -----------------------------------*/

.XAML-command-info {
	padding-left: 24px;

}

.XAML-command-body {}
.XAML-command-wall .wt-stack-wrap-cell { vertical-align: top }

.XAML-command-select {
	margin-top: 80px;
	background-color: #FFFFFF;
	padding: 16px;
	border-radius: 4px;
}

.XAML-command-person-photo {
	background-size: cover !important;
	width: 168px !important;
	height: auto !important;
}

.XAML-command-wall-tile  {
	width: 168px;
}

.XAML-command-wall-photo {
	background-size: cover !important;
	width: 160px !important;
	height: 200px !important;
}

.XAML-command-wall-name {
	width: 160px;
	white-space: normal;
}

.XAML-command-wall-date {
	width: 160px;
	white-space: normal;
	font-size: 13px;
}

.XAML-command-status {
	padding: 4px 8px;
	border-radius: 4px;
	white-space: nowrap;
	background-color: #4176ea;
	color: #FFFFFF;
	font-size: 13px;
}

.XAML-status-container {
	padding: 4px 8px;
	font-size: 13px;
	border-radius: 4px;
}

/*--------- Стили шаблона Cлайдер адаптивный с текстом -------*/

/* pager */
.cycle-slideshow .slider-slide { background-size: cover; background-repeat: no-repeat; background-position: center center; width: 100%;  }

.cycle-pager {
    text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 8px; overflow: hidden;
}
.cycle-pager span {
    font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif; font-size: 60px; width: 16px; height: 16px;
    display: inline-block; color: #FFFFFF; cursor: pointer;
}
.cycle-pager span.cycle-pager-active { color: #4176ea;}
.cycle-pager > * { cursor: pointer;}


/* prev / next links */
.cycle-prev, .cycle-next { position: absolute; top: 0; width: 150px; opacity: 0; filter: alpha(opacity=0); z-index: 500; height: 100%; cursor: pointer; }
.cycle-prev { left: 0;  background: url(design/default/images/slider_arrow_left.png) 50% 50% no-repeat;}
.cycle-next { right: 0; background: url(design/default/images/slider_arrow_right.png) 50% 50% no-repeat;}
.cycle-prev:hover, .cycle-next:hover { opacity: .7; filter: alpha(opacity=70) }

.slider-slide-content { padding-top: 40px; color: #FFFFFF; width: 1176px; margin: 0 auto; }
.slider-main-header { color: #FFFFFF; font-size: 34px; font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif; margin-bottom: 32px; }
.slider-small-header { color: #FFFFFF; font-size: 19px; font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif; margin-bottom: 32px; margin-top: 32px;  }
.slider-button { background-color: #4176ea; color: #FFFFFF; font-size: 19px; font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif; border-radius: 4px; padding:  8px 16px; width: auto; display: inline-block; z-index: 501; cursor: pointer}

/*--------- Стили шаблона Сетка баннеров горизонтальная -------*/

.slider_grid { min-width: 900px !important; max-height: 18vw; overflow: hidden !important; background-color: #F3F3F3; }
body.mobile .slider_grid { display: none !important }

.slider_grid_left {
	float: left;
	width: 33%;
	min-width: 120px;
	min-height: 13vw;
	display: inline-block;
	box-sizing: border-box;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover ;
	position: relative;
	transition: all 0.5s linear;
	-moz2: all 0.5s linear;
	-webkit2: 0.5s linear;
	-o2: all 0.5s linear;
	box-shadow: inset 0vw 5vw 10vw 1vw rgba(0,0,0,0.7);
}

.slider_grid_center {
	float: left;
	width: 33%;
	min-width: 120px;
	min-height: 13vw;
	display: inline-block;
	box-sizing: border-box;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	transition: 0.5s linear;
	box-shadow: inset 0vw 3vw 8vw 1vw rgba(0,0,0,0.7);
}

.slider_grid_right {
	float: left;
	width: 34%;
	height: 13vw;
	min-width: 120px;
	min-height: 13vw;
	float: left;
	display: inline-block;
	box-sizing: border-box;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	transition: 0.5s linear;
	box-shadow: inset 0vw 3vw 8vw 1vw rgba(0,0,0,0.7);
}

.slider_grid_left:hover, .slider_grid_center:hover, .slider_grid_right:hover {
	background-size: 110% auto;
	transition: all 0.5s linear;
	-moz2: all 0.5s linear;
	-webkit2: 0.5s linear;
	-o2: all 0.5s linear;
	cursor: pointer;
}

.slider_name { top: 0px; left: 0px; text-align: left; display: block; color: #FFFFFF; font-size: 1.2vw; padding: 20px; height: 100%;}

/*--------------- Виджеты --------------*/

.blockText,
.blockImage{
	margin: 0 0 24px 0;
	border-radius: 4px;
}
.blockTextOutline, td.blockTextOutline {
	margin: 0 0 24px 0;
	padding:  24px;
	border-radius: 4px;
	background-color: #FFFFFF;
}

.blockTextBorder, td.blockTextBorder { border: 1px solid #c9ccd4;
	padding:  24px;
	border-radius: 4px;
}
div.blockImage, .blockImageInside { position: relative; }
div.blockImage img { border-radius: 4px; }
div.blockImageInside { position: relative; display: inline-block; }
div.blockImageText { /* position: absolute; */ }

.icon-quote-left-ico { opacity: 0.5; }

div.columnsBlock { margin-left: 0px; width: 100%; }
div.columnBlock { float: left }

div.columnImage {
	text-align: center;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0 auto 24px auto;
}

.listItem { margin: 0px 0px 16px 0px; }
.listBlock div.listItem:last-child { margin: 0px }
.listItemIcon { float: left; }
.listItemIcon icon { font-size: 1.5em }
.listItemContent { display: table-cell; }

.lectorDesc { /* display: none */ }

.blockFileIcon { display: inline-block; float: left; width: 100px; height: 100px; background-repeat: no-repeat; background-position: left top; cursor: pointer; }
.blockFileInfo { display: inline-block; width: calc(100% - 100px); }
.blockFileName { /* padding-bottom: 16px; */ cursor: pointer; }
.blockFileParams { padding-top: 8px; }

#zone-left .blockFileIcon, #zone-right .blockFileIcon { display: inline-block; float: none; width: 100%; height: 100px; background-repeat: no-repeat; background-position: center top; cursor: pointer; }
#zone-left .blockFileInfo, #zone-right .blockFileInfo { width: 100%; }
#zone-left .blockFileName, #zone-right .blockFileName { text-align: center }

.imageBlockBackground { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; margin: 0px auto 8px auto; }
.imageBlockReplace { position: absolute; bottom: 0; left: 0; background-color: #FFF; font-size: 12px; opacity: 0.0; padding: 8px 8px 16px 8px; text-align: center; width: 100%; box-sizing: border-box; cursor: pointer; }
.wt-lp-wmyphoto-no-bg .imageBlockReplace { background-color: #f3f3f4; }
.imageBlockName, .imageBlockPosition { margin: 0 auto; text-align: center; }
body.mobile .imageBlockReplace { opacity: 0.7 !important }

/* ------ Стили виджета "Моя мое развитие карьеры" ------ */
.XAML-task-stage-header {
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight: normal;
	margin: 0 0 16px 0;
	text-align: center;
}

.task-progress-bar-inner {
	color: #fff;
	background-color: #8ed100;
	border-radius: 8px;
	text-align: center;
}
.task-progress-bar-container {
	padding: 0.01em 16px;
	text-align: center;
	font-size: 17px;
}
.task-progress-bar-outer {
	color: #000!important;
	background-color: #f3f3f4;
	border-radius: 8px;
}

/* ------ Стили блока "Моя команда" ------ */

.bg-cover { border-radius: 50% }
.my_team_block .XAML-stack-tile-image-container { text-align: center }
.my_team_block .XAML-link-tile-title { text-align: center; font-size: 14px; }
.my_team_block .XAML-label-tile-desc { text-align: center; font-size: 13px }

/*---------------------------- Education plan -------------------------*/
.mp-div-status-success:before {   content: " ";
	background-image: url(design/default/images/success.png);
    background-position: center;
    background-size: 100%;
    width: 40px;
    height: 40px;
    z-index: 10000;
    position: absolute;
    top: -15px;
    right: -15px;
    	}
.mp-div-status-success { overflow: visible !important; }
.mp-div-status-failed:before {   content: " ";
	background-image: url(design/default/images/failed.png);
    background-position: center;
    background-size: 100%;
    width: 40px;
    height: 40px;
    z-index: 10000;
    position: absolute;
    top: -15px;
    right: -15px;
    	}
.mp-div-status-failed { overflow: visible !important; }

.XAML-icon-state-0:before { content: "\f00c"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-state-0-dark:before { content: "\f00c"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-1:before { content: "\f1d8"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-state-1-dark:before { content: "\f1d8"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-2, .XAML-icon-state-3 { width: 20px !important; text-align: center; }
.XAML-icon-state-2:before { content: "\f111"; font: normal normal normal 16px "icomoon"; color:#969eb2; }
.XAML-icon-state-2-dark:before { content: "\f111"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-3:before { content: "\f023"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-state-3-dark:before { content: "\f023"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-4:before { content: "\f00c"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-state-4-dark:before { content: "\f00c"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-5:before { content: "\f06e"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-state-5-dark:before { content: "\f06e"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-state-6:before { content: "\eb07"; font: normal normal normal 18px "icomoon"; color: #969eb2; }
.XAML-icon-state-6-dark:before { content: "\eb07"; font: normal normal normal 18px "icomoon"; color: #313a4a; }
.XAML-icon-state-blocked:before { content: "\ea0a"; font: normal normal normal 16px "icomoon"; color: #969eb2;}
.XAML-icon-state-blocked-dark:before { content: "\ea0a"; font: normal normal normal 16px "icomoon"; color: #313a4a; }

.XAML-icon-type-arrow:before { content: "\f054"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-arrow-dark:before { content: "\f054"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-arrow-parent:before { content: "\f078"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-arrow-dark-parent:before { content: "\f078"; font: normal normal normal 16px "icomoon"; color: #313a4a; }

.XAML-icon-type-folder:before { content: "\f07c"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-folder-dark:before { content: "\f07c"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-education_method:before { content: "\f19d"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-education_method-dark:before { content: "\f19d"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-course:before { content: "\f109"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-course-dark:before { content: "\f109"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-assessment:before { content: "\f046"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-assessment-dark:before { content: "\f046"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-event:before { content: "\e952"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-event-dark:before { content: "\e952"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-material-library_material:before { content: "\f016"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-material-library_material-dark:before { content: "\f016"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-learning_task:before { content: "\f0ae"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-learning_task-dark:before { content: "\f0ae"; font: normal normal normal 16px "icomoon"; color: #313a4a; }


.XAML-icon-type-webinar:before { content: "\f03d"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-webinar-dark:before { content: "\f03d"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-video:before { content: "\f04b"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-video-dark:before { content: "\f04b"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-file:before { content: "\f15b"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-file-dark:before { content: "\f15b"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-homework:before { content: "\f06d"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-homework-dark:before { content: "\f06d"; font: normal normal normal 16px "icomoon"; color: #313a4a; }
.XAML-icon-type-lamp:before { content: "\ebe4"; font: normal normal normal 16px "icomoon"; color: #969eb2; }
.XAML-icon-type-lamp-dark:before { content: "\ebe4"; font: normal normal normal 16px "icomoon"; color: #101828; }


.XAML-programname { color: #969eb2; font-size: 16px; padding: 0 8px 8px 8px; box-sizing: border-box; display: block; }
.XAML-programname:hover { color: #313a4a; font-size: 16px; padding: 0 8px 8px 8px; box-sizing: border-box; display: block; }
.XAML-programname-dark { color: #313a4a; font-size: 16px; margin: 0 8px 8px 8px; box-sizing: border-box; display: block; }
.XAML-programname-dark:hover { color: #313a4a; }


.XAML-education-plan-tree {
	border: 1px solid #c9ccd4;
	border-radius: 4px;
	margin: 0 /*16px */ 24px 16px 0;
	padding: 16px;
}

.XAML-education-plan-tree td { vertical-align: top }

/*---------------------------- End of Education plan -------------------------*/

/* --------------- Block Styles (Standart, Invert) -------------------------- */



/*------------- MOBILE -----------------*/


/* RTE append start */
/*200329*/
/*wiki-rte-styles*/
.wt-rte-title { color: #313a4a; font-family: Roboto, sans-serif; font-size: 34px; font-weight: 300; line-height: 1em; }
.wt-rte-subtitle { color: #313a4a; font-family: Roboto, sans-serif; font-size: 17px; font-weight: 500; }
.wt-rte-marker { background-color: #ff0; }
.wt-rte-compact-table { border-spacing: 1; border-collapse: collapse; }
.wt-rte-compact-table td { padding: 2px; border: solid 1px #eee; }
.wt-rte-toggled-table { border-spacing: 0; border-collapse: collapse; }
.wt-rte-toggled-table tr td { padding: 4px; border-bottom: solid 1px transparent; }
.wt-rte-toggled-table tr:nth-of-type(2n+1) td { background-color: #ffc; }
.wt-rte-toggled-table tr:nth-of-type(2n) td {  background-color: #eef; }
.wt-rte-list-squared { list-style-type: square; }
.wt-rte-list-roman { list-style-type: upper-roman; }
.wt-rte-shadow-block { display: block; background-color: #fff; margin: 16px 0 0 0; padding: 16px; box-sizing: border-box; border: none; border-radius: 4px; box-shadow: 0 0 8px rgba(0,0,0,0.25); }
.wt-rte-note { display: table; border-radius: 4px; margin: 16px 0 0 0; min-height: 50px; width: 100%; box-sizing: border-box; border: solid 2px #393; background-color: #efe; padding: 16px 16px 16px 48px; color: #393; background-position: 8px center; background-size: 32px 32px; background-repeat: no-repeat; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23393%22%3E%3Cpath%20d%3D%22M21.436%2C7.586l-3.998-4.02c-0.752-0.756-2.063-0.764-2.83-0.006c-0.196%2C0.196-0.35%2C0.436-0.418%2C0.629%20c-0.653%2C1.362-1.354%2C2.215-2.254%2C2.727l-0.217%2C0.105C10.751%2C7.506%2C9.434%2C8%2C7%2C8C6.734%2C8%2C6.479%2C8.052%2C6.234%2C8.152%20C5.75%2C8.354%2C5.355%2C8.747%2C5.152%2C9.236c-0.199%2C0.484-0.199%2C1.041%2C0%2C1.525c0.104%2C0.249%2C0.25%2C0.471%2C0.435%2C0.651l3.235%2C3.235L5%2C20%20l5.352-3.822l3.227%2C3.227c0.186%2C0.189%2C0.406%2C0.339%2C0.656%2C0.441C14.482%2C19.949%2C14.738%2C20%2C15.001%2C20s0.519-0.052%2C0.765-0.154%20c0.498-0.205%2C0.883-0.592%2C1.08-1.078c0.103-0.242%2C0.155-0.507%2C0.155-0.768c0-2.436%2C0.494-3.752%2C0.978-4.721%20c0.496-0.992%2C1.369-1.748%2C2.754-2.414c0.271-0.104%2C0.51-0.256%2C0.711-0.457C22.216%2C9.626%2C22.212%2C8.357%2C21.436%2C7.586z%20M16.188%2C12.387%20c-0.819%2C1.643-1.188%2C3.37-1.195%2C5.604L7%2C10c2.139%2C0%2C3.814-0.335%2C5.396-1.084l0.235-0.105c1.399-0.699%2C2.468-1.893%2C3.388-3.834%20l3.924%2C4.051C18.08%2C9.921%2C16.887%2C10.988%2C16.188%2C12.387z%22%20%2F%3E%3C%2Fsvg%3E'); }
.wt-rte-idea { display: table; border-radius: 4px; margin: 16px 0 0 0; min-height: 50px; width: 100%; box-sizing: border-box; border: solid 2px #39c; background-color: #efe; padding: 16px 16px 16px 48px; color: #39c; background-position: 8px center; background-size: 32px 32px; background-repeat: no-repeat; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2032%2032%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%2339c%22%3E%3Cpath%20d%3D%22M16%2C7a8.36%2C8.36%2C0%2C0%2C0-8%2C8%2C8.4%2C8.4%2C0%2C0%2C0%2C2.29%2C5.7A4.56%2C4.56%2C0%2C0%2C1%2C12%2C24a1%2C1%2C0%2C0%2C0%2C1%2C1h6a1%2C1%2C0%2C0%2C0%2C1-1%2C4.46%2C4.46%2C0%2C0%2C1%2C1.69-3.28A7.87%2C7.87%2C0%2C0%2C0%2C24%2C15a8.17%2C8.17%2C0%2C0%2C0-2.44-5.83A7.67%2C7.67%2C0%2C0%2C0%2C16%2C7Zm4.34%2C12.28A6.87%2C6.87%2C0%2C0%2C0%2C18.09%2C23H13.91a7%2C7%2C0%2C0%2C0-2.2-3.71A6.41%2C6.41%2C0%2C0%2C1%2C10%2C15a6.29%2C6.29%2C0%2C0%2C1%2C6-6%2C5.63%2C5.63%2C0%2C0%2C1%2C4.13%2C1.6A6.16%2C6.16%2C0%2C0%2C1%2C22%2C15%2C5.93%2C5.93%2C0%2C0%2C1%2C20.31%2C19.28Z%22%20%2F%3E%3Cpath%20d%3D%22M19%2C26H13a1%2C1%2C0%2C0%2C0%2C0%2C2h6a1%2C1%2C0%2C0%2C0%2C0-2Z%22%20%2F%3E%3Cpath%20d%3D%22M18%2C29H14a1%2C1%2C0%2C0%2C0%2C0%2C2h4a1%2C1%2C0%2C0%2C0%2C0-2Z%22%20%2F%3E%3Cpath%20d%3D%22M16%2C5a1%2C1%2C0%2C0%2C0%2C1-1V2a1%2C1%2C0%2C0%2C0-2%2C0V4A1%2C1%2C0%2C0%2C0%2C16%2C5Z%22%20%2F%3E%3Cpath%20d%3D%22M5%2C14H3a1%2C1%2C0%2C0%2C0%2C0%2C2H5a1%2C1%2C0%2C0%2C0%2C0-2Z%22%20%2F%3E%3Cpath%20d%3D%22M29%2C14H27a1%2C1%2C0%2C0%2C0%2C0%2C2h2a1%2C1%2C0%2C0%2C0%2C0-2Z%22%20%2F%3E%3Cpath%20d%3D%22M25.9%2C5.1a1%2C1%2C0%2C0%2C0-1.41%2C0L23.07%2C6.51a1%2C1%2C0%2C0%2C0%2C0%2C1.42%2C1%2C1%2C0%2C0%2C0%2C.71.29%2C1%2C1%2C0%2C0%2C0%2C.71-.29L25.9%2C6.51A1%2C1%2C0%2C0%2C0%2C25.9%2C5.1Z%22%20%2F%3E%3Cpath%20d%3D%22M8.93%2C7.93a1%2C1%2C0%2C0%2C0%2C0-1.42L7.51%2C5.1A1%2C1%2C0%2C0%2C0%2C6.1%2C6.51L7.51%2C7.93a1%2C1%2C0%2C0%2C0%2C.71.29A1%2C1%2C0%2C0%2C0%2C8.93%2C7.93Z%22%20%2F%3E%3C%2Fsvg%3E'); }
.wt-rte-example { display: table; margin: 16px 0 0 0; padding: 16px; box-sizing: border-box; border-left: solid 8px #ccc; color: #666; font-style: italic; }
.wt-rte-attention { display: table; border-radius: 4px; margin: 16px 0 0 0; min-height: 50px; width: 100%; box-sizing: border-box; border: solid 2px #f90; padding: 16px 16px 16px 48px; color: #f90; background-position: 8px center; background-size: 32px 32px; background-repeat: no-repeat; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%20500%20500%22%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23f90%22%3E%3Cpath%20d%3D%22M250.5%2C447.3L53.2%2C250L250.5%2C52.7L447.8%2C250L250.5%2C447.3z%20M91.9%2C250l158.6%2C158.6L409.1%2C250L250.5%2C91.4L91.9%2C250z%22%20%2F%3E%3Crect%20height%3D%22109.5%22%20transform%3D%22matrix(-1%20-1.224647e-016%201.224647e-016%20-1%20500.9986%20445.165)%22%20width%3D%2227.4%22%20x%3D%22236.8%22%20y%3D%22167.8%22%20%2F%3E%3Crect%20height%3D%2227.4%22%20transform%3D%22matrix(-1%20-1.224647e-016%201.224647e-016%20-1%20500.9986%20636.7959)%22%20width%3D%2227.4%22%20x%3D%22236.8%22%20y%3D%22304.7%22%20%2F%3E%3C%2Fsvg%3E'); }
.wt-rte-forbidden { display: table; border-radius: 4px; margin: 16px 0 0 0; min-height: 48px; width: 100%; box-sizing: border-box; border: solid 2px #c00; background-color: #ffd; padding: 16px 16px 16px 48px; color: #c00; background-position: 8px center; background-size: 30px 30px; background-repeat: no-repeat; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20style%3D%22fill%3A%23c00%22%3E%3Cg%20transform%3D%22translate(-816.000000%2C-336.000000)%22%3E%3Cpath%20d%3D%22M824%2C350%20C825.402054%2C350%20826.691788%2C349.519101%20827.713252%2C348.713252%20L819.286748%2C340.286748%20C818.480899%2C341.308212%20818%2C342.597946%20818%2C344%20C818%2C347.313709%20820.686291%2C350%20824%2C350%20Z%20M828.713252%2C347.713252%20C829.519101%2C346.691788%20830%2C345.402054%20830%2C344%20C830%2C340.686291%20827.313709%2C338%20824%2C338%20C822.597946%2C338%20821.308212%2C338.480899%20820.286748%2C339.286748%20Z%20M824%2C352%20C819.581722%2C352%20816%2C348.418278%20816%2C344%20C816%2C339.581722%20819.581722%2C336%20824%2C336%20C828.418278%2C336%20832%2C339.581722%20832%2C344%20C832%2C348.418278%20828.418278%2C352%20824%2C352%20Z%20M824%2C352%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E'); }
ol.wt-rte-customized-ol { counter-reset: wt-counter-1; list-style: none; padding-left: 40px; }
ol.wt-rte-customized-ol li { margin: 0 0 8px 0; counter-increment: wt-counter-1; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ol.wt-rte-customized-ol li::before { content: counter(wt-counter-1); color: #fff; font-size: 16px; font-weight: bold; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; background: #39c; border-radius: 50%; text-align: center; }
.img-magnifier-container { position: relative; }
.img-magnifier-glass { position: absolute; border: 1px solid #999; border-radius: 50%; cursor: none; width: 160px; height: 160px; }

ul.wt-rte-ul-arrowhead-left { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrowhead-left li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrowhead-left li::before { content: "\2B9C"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-arrowhead-up { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrowhead-up li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrowhead-up li::before { content: "\2B9D"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-arrowhead-right { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrowhead-right li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrowhead-right li::before { content: "\2B9E"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-arrowhead-down { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrowhead-down li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrowhead-down li::before { content: "\2B9F"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-arrow-left { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrow-left li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrow-left li::before { content: "\1F844"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-arrow-up { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrow-up li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrow-up li::before { content: "\1F845"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }
ul.wt-rte-ul-arrow-right { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrow-right li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrow-right li::before { content: "\1F846"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-arrow-down { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-arrow-down li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-arrow-down li::before { content: "\1F847"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-barb-arrow-left { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-barb-arrow-left li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-barb-arrow-left li::before { content: "\1F878"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-barb-arrow-up { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-barb-arrow-up li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-barb-arrow-up li::before { content: "\1F879"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }
ul.wt-rte-ul-barb-arrow-right { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-barb-arrow-right li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-barb-arrow-right li::before { content: "\1F87A"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }
ul.wt-rte-ul-barb-arrow-down { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-barb-arrow-down li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-barb-arrow-down li::before { content: "\1F87B"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-box-arrow-left { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-arrow-left li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-arrow-left li::before { content: "\2B05"; background-color: #39c; color: #fff; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; border-radius: 4px;  text-align: center; top: 2px; }
ul.wt-rte-ul-box-arrow-up { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-arrow-up li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-arrow-up li::before { content: "\2B06"; background-color: #39c; color: #fff; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; border-radius: 4px;  text-align: center; top: 2px; }
ul.wt-rte-ul-box-arrow-right { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-arrow-right li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-arrow-right li::before { content: "\27A1"; background-color: #39c; color: #fff; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; border-radius: 4px;  text-align: center; top: 2px; }
ul.wt-rte-ul-box-arrow-down { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-arrow-down li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-arrow-down li::before { content: "\2B07"; background-color: #39c; color: #fff; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; border-radius: 4px;  text-align: center; top: 2px; }

ul.wt-rte-ul-fisheye { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-fisheye li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-fisheye li::before { content: "\25C9"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-diamond { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-diamond li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-diamond li::before { content: "\2B25"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-4-star { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-4-star li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-4-star li::before { content: "\2726"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-5-star { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-5-star li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-5-star li::before { content: "\2605"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }

ul.wt-rte-ul-6-star { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-6-star li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-6-star li::before { content: "\2736"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }

ul.wt-rte-ul-8-star { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-8-star li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-8-star li::before { content: "\2734"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }

ul.wt-rte-ul-asterisk { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-asterisk li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-asterisk li::before { content: "\1F7B8"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }

ul.wt-rte-ul-checkmark { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-checkmark li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-checkmark li::before { content: "\1F5F8"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-box-checkmark { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-checkmark li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-checkmark li::before { content: "\1F5F9"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

ul.wt-rte-ul-cross { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-cross li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-cross li::before { content: "\2A2F"; color: #39c; font-size: 32px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 0; }

ul.wt-rte-ul-box-cross { list-style: none; padding-left: 40px; }
ul.wt-rte-ul-box-cross li { margin: 0 0 8px 0; position: relative; min-height: 32px; padding: 6px 0 0 0; box-sizing: border-box; }
ul.wt-rte-ul-box-cross li::before { content: "\2BBD"; color: #39c; font-size: 24px; position: absolute; left: -40px; line-height: 32px; width: 32px; height: 32px; top: 2px; }

img.wt-rte-img-max-100 { max-width: 100%; height: auto !important; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: zoom-in; }
img.wt-rte-img-max-75 { max-width: 75%; height: auto !important; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: zoom-in; }
img.wt-rte-img-max-50 { max-width: 50%; height: auto !important; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: zoom-in; }
img.wt-rte-img-max-25 { max-width: 25%; height: auto !important; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; cursor: zoom-in; }
/*wiki-rte-styles end*/
/* LPE/RTE append end */

/* Timeline */
html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
/* MAIN
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.box-view-timeline {
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px;
}
.wrapper-timelines,
ol.name-timelines,
.wrapper-timelines *,
ol.name-timelines * {
	/* font-family: "Helvetica Neue", sans-serif; */
	font-family: 'Roboto', 'Open Sans', Trebuchet MS, Verdana, Tahoma, sans-serif;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
/* DIALOG
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.dialog-for-timeline.ui-widget.ui-widget-content {
	max-width: 35%;
}
.dialog-for-timeline {
	border: 2px solid #f3f3f4 !important;
}
.dialog-for-timeline .ui-widget-header {
	/* background-color: #315DFA !important; */
}
.dialog-for-timeline .dlg-container {
	margin: 0 auto;
	overflow: hidden;
	font-family: Roboto, Arial, sans-serif;
}
.dialog-for-timeline .dlg-container .box-desc,
.dialog-for-timeline .dlg-container .line-info .label {
	float: left;
}
.dialog-for-timeline .dlg-container .box-desc {
	max-width: calc(100% - 22rem);
    text-align: left;
}
.dialog-for-timeline .dlg-container .box-img {
	display: flex;
	flex-direction: column;
	width: 20rem;
	padding: 0;
	background-color: #fff;
	margin: 0 2rem 0 0;
	float: left;
}
.dialog-for-timeline .dlg-container .box-img .wrap-img {
	position: relative;
    display: block;
    width: 20rem;
    min-height: 7rem;
    max-height: 180px;
    flex-grow: 0;
    background-image: none;
}
.dialog-for-timeline .dlg-container .box-img .wrap-img a {
	max-height: 180px;
    display: block;
}
.dialog-for-timeline .dlg-container .box-img .wrap-img img {
	max-width: 100%;
    height: 100%;
    max-height: 180px;
}
.dialog-for-timeline .dlg-container .line-info {
	display: flex;
	flex-direction: row;
	align-items: center;
	background-color: #fff;
	border-radius: 0;
	padding: 0.5rem 0;
	margin: 0;
	border-bottom: solid 1px #D1DCF8;
	flex-shrink: 0;
}
.dialog-for-timeline .dlg-container .line-info .label {
	display: block;
	font-size: inherit;
	color: #999;
	margin: 0 10px 0 0;
	white-space: nowrap;
	min-width: 16rem;
	text-align: left;
}
.dialog-for-timeline .dlg-container {
	text-align: center;
}
.dialog-for-timeline {
    font-family: Verdana,Arial,sans-serif;
	font-size: 2em;
	padding: 0 !important;
}

/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.wrapper-timelines {
	width: 85%;
	float: right;
	padding-right: 50px;
	position: relative;
	height: 100%;
	display: flex;
}
.timeline {
	height: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin: 0 auto;
	position: relative;
}
.timeline ol {
	font-size: 0;
	transition: all 0.2s;
}
.timeline .list-items-desc {
	font-size: 1.5rem;
}
.timeline ol li {
	position: relative;
	display: inline-block;
	list-style-type: none;
	height: 1px;
	background: #ffffff;
}
.timeline ol li .li-point {
	/*display: none;*/
	position: absolute;
	top: -3px;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #F45B69;
	z-index: 1;
}
.timeline ol li .line-point {
    position: absolute;
	left: calc(100% + 7px);
	transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	-moz-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	-o-transform: translateY(-100%);
    height: 50px;
    width: 1px;
    background: #f45b69;
}
.timeline ol li .img-link-point,
.timeline ol li .div-link-point {
	position: absolute;
	left: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	z-index: 1;
	cursor: pointer;
}
.timeline time {
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 8px;
}
/* DESC POINT
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline ol li div.desc-point,
.desc-point .list-items-desc li.item-desc {
	background: #f3f3f4;
}

.timeline ol li div.desc-point {
    position: absolute;
	left: calc(100% + 7px);
	transition: 0.1s;
	border-radius: 0px 15px 15px 15px;
	transform: scale(0);
	opacity: 0;
	z-index: -1;
}
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar {
	width: 10px;
	border-right: 5px solid transparent;
}
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar-button {  background-color: transparent; }
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar-track {
	background-color: #999;
	box-shadow: inset 0 0 5px grey;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
}
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar-track-piece { background-color: #ffffff;}
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar-thumb {
	background-color: #456990;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
}
.timeline ol li div.desc-point .content-desc-point::-webkit-scrollbar-corner { background-color: transparent;}
.timeline ol li div.desc-point .content-desc-point::-webkit-resizer { background-color: transparent;}

.timeline ol li div.desc-point .content-desc-point ::-webkit-scrollbar-thumb:hover {
	background: #003f84;
  }

.timeline ol li div.desc-point.active {
	transform: scale(1);
	opacity: 1;
    z-index: 2;
}
.timeline ol li div.desc-point .content-desc-point {
	padding: 15px;
	max-height: 200px;
	max-width: 400px;
	overflow: hidden;
}
.timeline ol li div.desc-point .content-desc-point:hover {
	overflow: auto;
}
.timeline ol li div.desc-point .content-desc-point .pointer-desc-point {
    position: absolute;
    left: 0;
	border-style: solid;
	top: 100%;
    border-width: 8px 8px 0 0;
    border-color: #f3f3f4 transparent transparent transparent;
}
/* LIST ITEMS DESC
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.desc-point .list-items-desc {
	overflow: hidden;
}
.desc-point .list-items-desc .wrapper-mark-item-desc {
	position: absolute;
    left: 0;
	height: 100%;
}
.desc-point .list-items-desc .mark-item-desc {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	box-sizing: content-box;
	width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    border: 0.15em solid #4176ea;
}
.desc-point .list-items-desc .name-item-desc,
.desc-point .list-items-desc .mark-item-desc {
	cursor: pointer;
	border-color: #4176ea;
	color: #4176ea;
}
.desc-point .item-desc:hover .mark-item-desc,
.desc-point .item-desc:hover .name-item-desc {
	border-color: #F45B69;
	color: #F45B69;
}
.desc-point .list-items-desc li.item-desc {
	position: relative;
	display: block;
	height: 1.6em;
	padding-left: 1em;
	line-height: 1.7em;
    font-size: 22px;
    transition: 0.5s;
}
/* TIME LINE
------------------------------------------------------ */
.timeline ol.ol-time {
	position: absolute;
	bottom: 0px;
}
.timeline ol.ol-time .wrap-name-period {
    text-align: center;
    font-size: 20px;
	overflow: hidden;
	height: auto;
	background: transparent;
}
.timeline ol.ol-time .wrap-name-period .name-period {
	overflow: hidden;
}
.timeline .name-period .segment-timeline {
	float: left;
	text-align: center;
	min-height: 13px;
	position: relative;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
}
.timeline ol.ol-time .wrap-name-period .sign-name-period {
	float: left;
}
.timeline ol.ol-time .wrap-name-period .pillow-name-period {
	height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-left: 1px solid;
}
/* NAME TIMELINES
----------------------------------- */
ol.name-timelines {
	position: relative;
	float: left;
	width: 15%;
}
ol.name-timelines li {
	list-style-type: none;
	position: relative;
}
ol.name-timelines li .icon-sign-tl {
	position: absolute;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
	width: 1.3em;
    height: 1.3em;
    border-radius: 50%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
ol.name-timelines li .tl-name {
	display: block;
	margin-left: 2em;
    overflow: hidden;
    height: 100%;
    white-space: nowrap;
}
/* BALUN TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ol.name-timelines li.signature-timeline {
	cursor: pointer;
	display: block;
	white-space: nowrap;
	float: left;
    width: 95%;
}
.unselectable {
	user-select: none;
	user-select: inherit;
    -moz-user-select:none;
	-webkit-user-select:none;
	-ms-user-select: none;
}
/* CONTROLS
----------------------------------- */
.wrapper-timelines .arrows {
	position: relative;
	bottom: 0;
	height: 0;
}
.wrapper-timelines .arrows button {
    background: transparent;
    border: none;
    cursor: pointer;
	outline: none;
	transform: translateY(-50%);
}
.wrapper-timelines .arrows button > img {
	width: 40px;
	height: 40px;
}
.wrapper-timelines .arrows button.arrow__prev {
	float: left;
	margin-left: -50px;
}
.wrapper-timelines .arrows button.arrow__prev:active {
	padding: 1px 0 0 1px;
}
.wrapper-timelines .arrows button.arrow__next:active {
	padding: 1px 1px 0 0;
}
.wrapper-timelines .arrows button.arrow__next {
	float: right;
	margin-right: -40px;
}
.wrapper-timelines .arrows button.arrow__next img {
	transform: rotate(180deg);
}
.wrapper-timelines .arrows {
    position: absolute;
    width: 100%;
}
.wrapper-timelines .arrows button.arrow__next {
    margin-right: -40px;
    position: absolute;
    right: 50px;
}

/* TIMELIN LPE */
.wt-lp-timeline-block {
	width: 100%;
	position: relative;
	font-size: 1rem;
}

/* -- Personal data verification form styles -- */
form.ws-verification {
	display: flex;
	flex: 1;
	flex-direction: column;
	background-color: #fff;
	padding: 2rem;
}

form.ws-verification .ws-label-container {
	position: relative;
	display: none;
	/* flex: 1 0 auto; */
	margin: 2rem;
	min-width: 40rem;
	flex-direction: column;
}

form.ws-verification .ws-verification__content {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
}

form.ws-verification .ws-label-container .ws-label {
	flex-direction: column;
}

form.ws-verification .ws-label-container .ws-label[wt-role="code"] {
	display: none;
	margin-top: 1rem;
	width: 20rem;
}

form.ws-verification .ws-label-container .ws-label-container__done {
	display: none;
	position: absolute;
	background-color: rgba(255, 255, 255, 0.9);
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	cursor: default;
}
form.ws-verification .ws-label-container .ws-label-container__done span[wt-role="title"] {
	margin-top: 0.5rem;
	color: #4176ea;
	font-size: 2rem;
	font-weight: 600;
}
form.ws-verification .ws-label-container .ws-label-container__done svg {
	width: 10rem;
	height: 10rem;
}

form.ws-verification .ws-label-container .ws-label-container__done svg > g {
	fill: #4176ea;
}

form.ws-verification .ws-label-container .ws-label__title {
	font-size: 2rem;
}

form.ws-verification .ws-label-container .ws-label__current-value {
	font-size: 2rem;
	margin: 1rem 0;
	padding: calc(8px + 2px) 0;
}

form.ws-verification .ws-label-container .ws-label__value {
	font-size: 2rem;
	margin: 1rem 0;
}

form.ws-verification .ws-label-container .ws-label-container__info {

}

form.ws-verification .ws-label-container .ws-label-container__warning {
	color: #ff606f;
	margin-bottom: 1rem;
}

form.ws-verification .ws-label-container__controls { }

form.ws-verification .ws-label-container__controls .ws-btn { }

form.ws-verification .ws-label-container__controls .ws-btn.ws-btn--primary {
	background-color: #4176ea;
	color: #FFFFFF;
	transition: all 0.2s ease-in-out;
}
form.ws-verification .ws-label-container__controls .ws-btn.ws-btn--primary[disabled] {
	background-color: #adb1b9;
	border-color: #adb1b9;
	cursor: default;
}
form.ws-verification .ws-label-container__controls .ws-btn.ws-btn--primary:not([disabled]):hover {
	opacity: 0.85;
}

form.ws-verification .ws-label-container__controls .ws-btn.ws-btn--text-only {
	border: none;
	color: #4176ea;
	transition: all 0.2s ease-in-out;
}

form.ws-verification .ws-label-container__controls .ws-btn.ws-btn--text-only:hover {
	background-color: transparent;
	color: #4176ea;
	opacity: 0.85;
}
/* -- End of personal data verification form styles -- */

.dlg_select { padding: 8px !important; }
.dlg_select * { box-sizing: border-box; }
.dlg_select .XAML-stack-filters-container {}
.x-container.dlg_select .XAML-input-text, .x-container.dlg_select .XAML-input-text .x-form-item-body { width: auto !important; max-width:none; }
.x-container.dlg_select .XAML-input-text .x-form-field { font-size: 1.2em; padding: 8px 32px 8px 8px; width: 16em; }
.x-container.dlg_select .XAML-input-text .x-form-field::placeholder { color: #ccc; font-size: 1em; }
.x-container.dlg_select .XAML-panel-search .cssXPStackPanel .x-table-layout-cell { position: relative; }
.x-container.dlg_select .XAML-panel-search .XAML-button-view { position: absolute; padding: 8px; top: 0; left: -32px; }
.x-container.dlg_select .XAML-uni-content-header tr:nth-child(2) td div { border-radius: 0; }
.x-container.dlg_select .cssXPDataGrid .x-panel-body { border-radius: 0; border: solid 1px #c9ccd4; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPDataGrid .x-grid-view { border-bottom: none !important; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item { margin: 0; border-top: solid 1px #ebebec; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item:first-of-type { border-top: none; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item .x-grid-cell { background-color: #fff /* !important */; padding: 8px; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item-over .x-grid-cell { background-color: #ebebec !important; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item-selected .x-grid-cell { background-color: #def /* !important */; color: #315DFA; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item tr > .x-grid-cell:first-child { padding-left: 20px !important; background-repeat: no-repeat; background-position: 6px center; background-size: 10px 12px; }
.x-container.dlg_select .cssXPDataGrid .x-grid-item-selected tr > .x-grid-cell:first-child { background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20style%3D%22fill%3A%23315DFA%22%20viewBox%3D%220%200%20512%20512%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M448%2C71.9c-17.3-13.4-41.5-9.3-54.1%2C9.1L214%2C344.2l-99.1-107.3c-14.6-16.6-39.1-17.4-54.7-1.8%20c-15.6%2C15.5-16.4%2C41.6-1.7%2C58.1c0%2C0%2C120.4%2C133.6%2C137.7%2C147c17.3%2C13.4%2C41.5%2C9.3%2C54.1-9.1l206.3-301.7%20C469.2%2C110.9%2C465.3%2C85.2%2C448%2C71.9z%22%20%2F%3E%3C%2Fsvg%3E');  }
.x-container.cssXPSPXMLScreen.dlg_select .XAML-uni-content-header { margin-bottom: 0 !important; }
.x-container.cssXPSPXMLScreen.dlg_select .XAML-grid-dialog-buttons { padding: 0 0 8px 0 !important; }
.x-container.dlg_select .XAML-grid-dialog-buttons > .x-table-layout { margin: 8px 0 0 0; }
.x-container.dlg_select .XAML-grid-dialog-buttons .cssXPButton { margin: 0; font-size: 1em; width: 10em !important; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar { position: relative; padding: 0; height: auto !important; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar .x-box-menu-body-horizontal { float: none; position: relative; height: inherit !important; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar .x-box-menu-body-horizontal .x-box-target { position: relative; height: inherit; }
.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar .cssXPButton { position: relative !important; left: 0 !important; margin: 0 8px 0 0 !important; }
@media screen and (max-width: 767px)
{
	.x-container.cssXPSPXMLScreen.dlg_select .XAML-stack-filters-container { margin: 8px 0px 0px 0px; }
	.x-container.dlg_select .XAML-input-text .x-form-field { font-size: 1em; padding: 0 2.4em 0 0.5em; width: 20em; height: 3.2em }
	.x-container.dlg_select .XAML-input-text .x-form-field::placeholder { color: #ccc; font-size: 1em; margin-left: 1em; }
	.x-container.dlg_select .XAML-panel-search .XAML-button-view { padding: 0 !important; top: 0 !important; left: -3em !important; width: 3.2em !important; height: 100%; }
	.x-container.dlg_select .XAML-grid-filter > table > tbody > tr > td:last-child { padding: 0 !important; }
}
@media screen and (max-width: 400px)
{
	.x-container.cssXPSPXMLScreen.dlg_select .XAML-stack-filters-container { margin: 0; }
	.x-container.dlg_select .XAML-input-text .x-form-field { max-width: 88vw; }
	.x-container.cssXPSPXMLScreen.dlg_select .x-grid-item-container { max-width: 100% !important; }
	.x-container.cssXPSPXMLScreen.dlg_select .x-grid-item-container > .x-grid-item { width: 100% !important; }
	.x-container.cssXPSPXMLScreen.dlg_select .x-grid-item-container tr > .x-grid-cell:first-child { width: 100% !important; }
	.x-container.dlg_select .XAML-grid-dialog-buttons .cssXPButton { max-width: 40vw; }
	.x-container.cssXPSPXMLScreen.dlg_select .cssXPToolbar { display: flex; flex-direction: row; align-items: center; }
}

/* wtbadge start */
.wt-counter-badge { display: block; min-width: 64px; width: 64px; height: 64px; border-left: solid 1px #ebebec; }
.wt-counter-badge .wt-badge-wrapper { display: block; width: inherit; height: inherit; }
.wt-counter-badge .wt-badge-btn { display: flex; flex-direction: row; align-items: center; justify-content: center; width: inherit; height: inherit; padding: 0; margin: 0; border: none; outline: none; background-color: transparent; background-repeat: no-repeat; background-position: center 20px; background-size: 32px 32px; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20style%3D%22fill%3A%237f7f7f%22%20viewBox%3D%220%200%20128%20128%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M113%2C0H15A15%2C15%2C0%2C0%2C0%2C0%2C15V79.57a15%2C15%2C0%2C0%2C0%2C15%2C15H38.28a1%2C1%2C0%2C0%2C1%2C1%2C1V121a7%2C7%2C0%2C0%2C0%2C11.95%2C4.95L82.31%2C94.87a1%2C1%2C0%2C0%2C1%2C.71-.29h30a15%2C15%2C0%2C0%2C0%2C15-15V15A15%2C15%2C0%2C0%2C0%2C113%2C0Zm9%2C79.57a9%2C9%2C0%2C0%2C1-9%2C9H83a7%2C7%2C0%2C0%2C0-4.95%2C2L47%2C121.7a1%2C1%2C0%2C0%2C1-1.71-.71V95.57a7%2C7%2C0%2C0%2C0-7-7H15a9%2C9%2C0%2C0%2C1-9-9V15a9%2C9%2C0%2C0%2C1%2C9-9h98a9%2C9%2C0%2C0%2C1%2C9%2C9Z%22%20%2F%3E%3C%2Fsvg%3E'); }
.wt-counter-badge .wt-badge-value { display: inline; color: #7f7f7f; font-family: Inter, Arial, sans-serif; font-size: 12px; font-weight: 500;  }
.wt-counter-badge .wt-badge-btn:hover { background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%3F%3E%3Csvg%20style%3D%22fill%3A%23c00%22%20viewBox%3D%220%200%20128%20128%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M113%2C0H15A15%2C15%2C0%2C0%2C0%2C0%2C15V79.57a15%2C15%2C0%2C0%2C0%2C15%2C15H38.28a1%2C1%2C0%2C0%2C1%2C1%2C1V121a7%2C7%2C0%2C0%2C0%2C11.95%2C4.95L82.31%2C94.87a1%2C1%2C0%2C0%2C1%2C.71-.29h30a15%2C15%2C0%2C0%2C0%2C15-15V15A15%2C15%2C0%2C0%2C0%2C113%2C0Zm9%2C79.57a9%2C9%2C0%2C0%2C1-9%2C9H83a7%2C7%2C0%2C0%2C0-4.95%2C2L47%2C121.7a1%2C1%2C0%2C0%2C1-1.71-.71V95.57a7%2C7%2C0%2C0%2C0-7-7H15a9%2C9%2C0%2C0%2C1-9-9V15a9%2C9%2C0%2C0%2C1%2C9-9h98a9%2C9%2C0%2C0%2C1%2C9%2C9Z%22%20%2F%3E%3C%2Fsvg%3E'); }
.wt-counter-badge .wt-badge-btn:hover .wt-badge-value { color: #c00; }

.wt-call-container { position: fixed; display: flex; flex-direction: column; align-items: flex-end; gap: 1rem; justify-content: center; right: 0.5em; bottom: 0.5em; z-index: 90001; font-size: 16px; }

.wt-call-notifier { position: relative; display: flex; flex-direction: column; align-items: flex-end; gap: 0.5em; justify-content: center; opacity: 1; top: 0; transition: 0.25s ease-in-out; box-shadow: 0 0 1em rgba(255,255,255,0.6); padding: 0.75em; border-radius: 1em; min-width: 24em; width: 24em; max-width: 24em; background-color: #151515; border: solid 1px #262626; white-space: initial; }
.wt-call-notifier[wt-call='false'] { top: 8em; opacity: 0; }
.wt-call-notifier[wt-notifier-template] { display: none; }
.wt-call-notifier--top { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 0.5em; padding: 0; width: 100%; }
.wt-call-notifier--top-line { flex-grow: 1; font-size: 0.825em; font-weight: bold; color: #fff; }
.wt-call-notifier--btn-close { display: flex; flex-direction: row; align-items: center; justify-content: center; min-width: 1em; width: 1em; min-height: 1em; height: 1em; padding: 0; margin: 0; border: none; outline: none; cursor: pointer; background-color: transparent; }
.wt-call-notifier--btn-close:hover { background-color: transparent; }
.wt-call-notifier--btn-close svg { color: #c2c3c4; }
.wt-call-notifier--btn-close:hover svg { color: #fff; }
.wt-call-notifier--wrapper { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 0.5em; width: 100%; }
.wt-call-notifier--body { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 0.5em; flex-grow: 1; }
.wt-call-notifier--avatar { display: flex; flex-direction: row; align-items: center; justify-content: center; position: relative; padding: 0; }
.wt-call-notifier--avatar-icon { display: flex; flex-direction: row; align-items: center; justify-content: center; min-width: 2.5em; width: 2.5em; min-height: 2.5em; height: 2.5em; border-radius: 50%; background-color: #c2c3c4; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.wt-call-notifier--btns { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 0.5em; }
.wt-call-notifier--info { display: flex; flex-direction: column; gap: 0.25em; flex-grow: 1; }
.wt-call-notifier--info-line { display: flex; flex-direction: row; width: 100%; line-height: normal; }
.wt-call-notifier--header { font-size: 0.75em; color: #ebebec; }
.wt-call-notifier--title { font-size: 0.825em; font-weight: 500; color: #ffffff; flex-grow: 1; width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wt-call-notifier--btn { display: flex; flex-direction: row; align-items: center; justify-content: center; min-width: 2.5em; width: 2.5em; min-height: 2.5em; height: 2.5em; padding: 0; border: none; outline: none; cursor: pointer; background-color: transparent; }
.wt-call-notifier--btn:hover {background-color: transparent; }
.wt-call-notifier--btn .wt-round-btn-inner { display: flex; flex-direction: row; align-items: center; justify-content: center; width: inherit; min-width: inherit; max-width: inherit; height: inherit; min-height: inherit; max-height: inherit; padding: 0;  border-radius: 50%; }
.wt-call-notifier--btn .wt-round-btn-inner svg { width: 1.5em; height: 1.5em; }
.wt-call-notifier--btn-accept .wt-round-btn-inner { background-color: #64c403; color: #fff; }
.wt-call-notifier--btn-accept:hover .wt-round-btn-inner { background-color: #52980b; }
.wt-call-notifier--btn-reject .wt-round-btn-inner { background-color: #ff5868; color: #fff; }
.wt-call-notifier--btn-reject:hover .wt-round-btn-inner { background-color: #c3414d; }
.wt-call-notifier--btn-group { display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 1em; border-radius: 0.25em; background-color: #4176ea; color: #fff; font-size: 0.75em; white-space: nowrap; border: none; outline: none; cursor: pointer;  }
.wt-call-notifier--btn-group:hover { background-color: #355bbb; }
.wt-call-notifier[wt-call-type='chat'] [wt-call-type='group'], .wt-call-notifier[wt-call-type='group'] [wt-call-type='chat'] { display: none; }
@media screen and (max-width: 460px)
{
	.wt-call-notifier[wt-call='false'] { bottom: -40vh; }
	.wt-call-notifier--wrapper { min-width: 16em; max-width: calc(100vw - 1em); flex-direction: column; }
	.wt-call-notifier--body { flex-direction: column; }
	.wt-call-notifier--avatar-icon { min-width: 6em; width: 6em; max-width: 6em; min-height: 6em; height: 6em; max-height: 6em; }
	.wt-call-notifier--btns { gap: 1em; padding: 1em; }
	.wt-call-notifier--btn { min-width: 4em; width: 4em; max-width: 4em; min-height: 4em; height: 4em; max-height: 4em; }
	.wt-call-notifier--info { flex-grow: 0; text-align: center; }
}
/* wtbadge end */

/* wthcm - calculate styles */

.goal-value { background-color: #4176ea;  }

/* vchat start */
.mode-vchat .page-content {
	display: flex;
}
.mode-vchat .page,
.mode-vchat .zone-main,
.mode-vchat .page-content,
.mode-vchat .zone-main-wrapper {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
}
/* vchat end */