
/*@font-face {
  font-family: 'ArialRoundedMTProCyr';
  src: url('/fonts/ArialRoundedMTProCyr.otf');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'ArialRoundedMTProCyr-Bold';
  src: url('/fonts/ArialRoundedMTProCyr-Bold.otf');
  font-weight: bold;
  font-style: normal;
}
*/
.body,
.wrapper {
  position: absolute;
  top: 0px;
  width: 100%;
  min-height: 100%;
  margin: 0;
  overflow-y: hidden;
  text-shadow: none !important;
  background-color: #ffffff;
}

.body {
  z-index: 1;
  /*background-color: #348def !important;*/
}

.wrapper {
  z-index: 2;
}

#main_div {
  max-width: 480px;
}
body, button {
/*  font-family: ArialRoundedMTProCyr, Formular, Arial; */
  font-family: Roboto, Arial;
}

.wrapper{
    max-width: 480px;
    min-width: 320px;
    margin: 0 auto;
    min-height: 100%;
    overflow-x: hidden;
} 
#id_wrapper {
  background-color: #ffffff;
}

/* MAIN WINDOW */
.button-new-s4 {
  display: flex;
  box-shadow: 0 0 10px #b0adad; 
  height: 50px;
  width: 240px;
  margin: 40px auto; 
  border-radius: 15px; 
  align-items: center; 
  justify-content: center;
}
.button-new-s4-img {
  width:20px;
  height: 20px;
  margin-right: 15px;
}
#id-main-button-new {
  font-size: 0.94em;
  color:rgb(58,58,58);
  font-weight: bold;
}
.root-menu-row {
  display:flex;
  justify-content: center;
  margin-top:20px;
}
.root-menu-div {
  width:100px;
  margin-right: 20px;
}
.root-menu-div-right {
  width:100px;
  margin-left: 20px;
}
.root-menu-sub {
  background-color: #348def;
  width:100px;
  height: 100px;
  border-radius: 30px;
}
.root-menu-sub-work {
  width:45px;
  height: 33px;
  margin-left: auto;
  margin-right: auto;
  padding-top:34px;
}
.root-menu-sub-arch, .root-menu-sub-task {
  width:40px;
  height: 40px;
  margin-left: auto;
  margin-right: auto;
  padding-top:30px;
}
.root-menu-sub-rep {
  width:36px;
  height: 41px;
  margin-left: auto;
  margin-right: auto;
  padding-top:30px;
}
.root-menu-img {
  width:45px;
  height: 33px;
  margin-left: auto;
  margin-right: auto;
  padding-top:34px;
}
.caption-main-menu {
  margin-top:6px;
  font-size: 0.8em;
  line-height:1.1em; 
  text-align: center;
  color: #8080808f;
}
.your-logo {
  height: 120px;
}
.your-logo img {
  max-height: 100px;
  border-radius: 10px;
  margin-top: 5px; 
  font-size: 30px;
}
.your-logo-text {
  font-size: 30px;
  text-align: center;
  padding-top:70px;
  color:rgb(63,63,63);
  font-family: Comfortaa;
}
@media screen and (max-height: 620px) {
  #dialog_start > div:nth-child(3) {
    margin-bottom: 35px;
  }
  .button-new-s4 {
    margin: 20px auto; 
  }
  .root-menu-row {
    margin-top:15px;
  }
  .your-logo {
    height: 100px;
  }
}
@media screen and (max-height: 556px) {
  .your-logo {
    height: 120px;
  }
  .your-logo-text {
    padding-top:50px;
  }
  .menu-admin-item {
	line-height: 2.6em;
  }
}
/* /MAIN WINDOW */

/* HEADER */
.root_header {
  font-family: ArialRoundedMTProCyr;
  position: static;
  width: 100%;
  background-color: #fff !important; 
  color: black !important;
  text-align: center;
  display: none;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 0px 7px 1px rgba(211, 211, 211, 0.5);
  /*margin: 0 12px;*/
  align-items: center;
  background-image: url('/img/header_bg.png');
  background-repeat: repeat-x;
  background-position-y: center;
}
#id_header_caption {
  display:none;
  justify-content: center; 
  align-items:center;
  height:50px;
  width: 60%;
  padding-top:5px;
  padding-left:10px;
  font-family: Roboto;
  font-weight: 400;
}
.root_header2 {
  z-index: 9;
  height:116px;
  background-color: #ffffff !important; 
}
.header-height {
  height: 66px;
}
.project_header {
	width: 88%;
	background-color: #ffffff; 
 	color: #3a3a3a;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-right: 5px;
	font-weight: bold;
	font-size: 16px;
}
#id_name_project {
	text-align: left;
	width: 100%;
	margin: 0 2px 0 20px;
	font-family: ArialRoundedMTProCyr, Arial;
	text-shadow: none;
	font-size: 1em;
	line-height: 0.9em;
  font-weight: bold;
}
#id_name_project span {
  margin-left: 20px;
  font-size: 0.8em;
  color: #999999;
}
#id_project {
  height:2em;
  padding-top:1.24em;
  width:40px;
}
#id-vids-graph {
  margin:1px 1px 1px 5px; 
  width:50px;
  height: 2em;
}
#id-txt-graph {
  width: 50px; 
  text-align:center;
  padding-top: 4px;
  padding-bottom: 0px;
  font-size: 19px;
  letter-spacing: 0.05em;
  line-height: 22px;
  color:#348def;
}
#id-my-graph {
  width: 50px; 
  height:0.25em;
  position: relative;
  display:none;
}
#id-my-green {
  position:absolute;
  top:0;
  left:0;
  width:20px;
  height:0.25em;
  background-color: #60C943;
}
#id-my-yellow {
  position:absolute;
  top:0;
  left:20px;
  width:10px;
  height:0.25em;
  background-color: #FFC31A;
}
#id-my-red {
  position:absolute;
  top:0;
  left:30px;
  width:20px;
  height:0.25em;
  background-color: #F45E45;
}

.left_img_header {
  height: 18px;
  width:30px;
  margin-left: 18px;
  cursor: pointer;
  background-image: url(/img-kt/back-arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.left_img_header2 {
  margin-left: 10px;
  height: 30px;
  width:30px;
  cursor: pointer;
}
.left_img_header2 img {
  width:16px;
  height:16px;
  margin:7px;  
}

.right_img_header img {
	height: 18px;
}
.right_img_header {
	height: 18px;
	float: right;
	margin-right: 25px;
	cursor: pointer;
  position: relative;
}
/* end of HEADER */

/* FOOTER */
#footer {
   position: fixed;
   left: auto;
   bottom: 0;
   width: 100%;
   max-width: 480px;
/*   height: 60px;*/
/*   background-color: #3a3a3a; 
   color: green;*/
   text-align: center;
   justify-content: space-around;
   align-items: center;
	z-index: 10;
   display: none;
/*   transition: height,display 0.5s;*/
/*   transition-delay: 0.5s;*/
}
.footer-height {
  height: 60px;
}

.icon_footer img {
 	max-height: 22px;
	cursor: pointer;
}

.icon_footer {
	height: 22px;
	cursor: pointer;
	background-size: 100%;
}
.caption-icon-footer {
  color: #bcbcbc;
  font-size: 0.7em;
  margin-top: 2px;
  /*display: none;*/
}
.icon-filter {
  text-align: center;
  /*display: none;*/
}
/*
.icon-level {
  text-align: center;
  display: none;
} */
.icon-footer-mnt {
  display: none;
  justify-content: space-around;
  text-align: center;
  width: 99%;
}
#filter-90 {
  display: none;
}
/* END OF FOOTER */

.list_groups {
    width: 100%;
    max-width: 480px;  
/*    padding: 0 6px;*/
    overflow: hidden;
	/*position-top: 0px !important;*/
	position: 	fixed;
	/*top: 		66px;
	bottom:		60px;*/
	overflow:	auto;
	background-color: #ffffff;
}
.list_groups li {
	list-style-type: none;
  padding: 0 6px;
}


.list_tasks, .list_tasks_d {
  max-width: 480px; 
  width: 100%;
  /*padding: 0 12px;*/
  overflow: hidden;
	/*position-top: 0px !important;*/
	position: 	fixed;
	/*top: 		66px;
	bottom:		60px;*/
	overflow:	auto;
  background-color: #ffffff !important;
  /*transition: top 1s;*/
}
  .list_groups-h, .list_tasks-h, .list_tasks-h-d {
    top:      66px;
    bottom:   60px;
    height: calc ( 100% - 126px );
  }
@media screen and (max-height: 650px) {
  .list_groups-h, .list_tasks-h, .list_tasks-h-d {
    top:      50px;
    bottom:   46px;
    height: calc ( 100% - 96px );
  }
}

.list_monitoring {
  border-radius: 6px;
  margin: 17px 0;
    /*box-shadow: 0 0 8px #b0adad;*/
  box-shadow: 0 0 9px 1px rgba(198, 198, 198, 0.755);
  text-shadow: none !important;
  font-weight: 300;
  min-height: 52px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.icon_command {
  display: inline;
  padding-top: 2px;
  height: 20px;
  cursor: pointer;
  margin-left: 3px;
  margin-right: 3px;
}

.div_b {
  display: flex;
	padding: 5px;
	position: relative;
	flex-grow: 2;
	/*width: 99%;*/
  background-color: white;
	color: black;
  justify-content: space-between;
  align-items: center;
}
.div_b_color {
  background-color: #f2f2f2 !important;
}

.div-edt-ind, .div-del-ind, .div-new-ind, .div-new-sub, .div-edt-tags, .div-store-hide, .div-check-check, .div-info-ind {
  margin-right: 10px;
}
.div-edt-ind img, .div-del-ind img, .div-new-ind img, .div-new-sub img, .div-edt-tags img, .div-store-hide img, .div-check-check img, .div-info-ind img {
  height: 17px;
}

.div_b_shadow {
  box-shadow: 0 0 9px 1px rgba(80,150,230,0.75);
}
.div-b-min-h {
  min-height: 74px;
}
.div-b-min-h0 {
  min-height: 84px;
}

.icon-command {
  height: 16px;
  cursor: pointer;
  margin: 8px 0 0 6px;
  padding-bottom: 1px;
  border: 1px solid transpar
}

.icon-and-name {
  display: flex;
}
.packet-row {
	list-style-type: none;
  /*padding: 5px;*/
  position: relative;
  flex-grow: 2;
  border-radius: 6px;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  /*width: 99%;
  background-color: white;*/
  box-shadow: 0 0 12px rgba(173, 173, 173, .8);
  font-family: Roboto;
  text-shadow: none !important;
  color: black;
  z-index: 100;
  justify-content: space-between;
  margin:  16px 8px;
/*  margin-top:   16px;*/
}
.number_p {
  width: 8%;
  font-size: 1.4em;
  font-weight: 700;
  color: #fb7777;
}
.issued {
  color: #7c7c7c;
}
.dir {
  width: 38%;
  color: #555555;
}
.receiver {
  width: 42%;
}
.commentary {
  font-size: 0.7em;
}
.weight {
  width: 12%;
}
.count_places {
  width: 8%;
}
.phone {
  width: 42%;
}
.cost {
  width: 12%;
}
.font-size-level0 {
  font-size: 15px;
  color: rgb(63,63,63);
}
.font-size-level1 {
  font-size: 14px;
  color: rgb(89,89,89);  
}
.font-size-level2, .font-size-level3, .font-size-level4 {
  font-size: 14px;
  color: rgb(99,99,99);  
}
.arrow-level {
  margin-right: 12px;
  max-width: 12px;
  max-height: 14px;
  margin-top: 4px;
}

.flex-container-grp {
    padding-top: 3px;
    padding-bottom: 0px;
    margin: 0;
    list-style: none;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: nowrap !important;
    justify-content: space-between;
    #align-items: center;
    -webkit-flex-flow: row wrap;
        flex-wrap: wrap;
    background: #ffffff;

}

.div_b_text_grp { /* номер СЧ у списку */
	padding-top: 5px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
	font-size: 	18px;
	color: #3a3a3a;
	font-weight: 500;
	text-align: left;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}
.div_b_text_grp span {
	color: #438def;
	font-weight: 300;
	margin-left: 10px;
	font-size: 	18px;
}
.div_mnt_date {
  font-size:0.8em;
  padding-top:0.5em;
  text-align:right;
}
.div_mnt_store {
  text-align:left;
  max-width:60%;
  font-size:0.8em;
  color:#4f4f4f
}
.div_mnt_autor {
  /*text-align:right;*/
  min-width: 50px;
  max-width:40%;
  font-size:0.8em;
  padding-top:0.5em;
  color:#c6c6c6
}

/* ADMIN */
.wrapper-adm {
  width: 100%;
  min-height: 100%;
  overflow-y: hidden;
  text-shadow: none !important;
  background-color: #ffffff;
  max-width: 480px;
  min-width: 320px;
  margin: 0 auto;
  z-index: 2;
}

.menu-admin-item {
	display: flex;
	align-items: center;
	border-radius: 3px;
	margin: 2px;
	padding: 2px;
	font-size: 1.2em;
	line-height: 3.2em;
	text-shadow: none;
	font-weight: 300;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}
.menu-admin-item img {
	max-height: 22px;
}
.menu-admin-item:hover {
	cursor: pointer;
	color: #348def;
}
#id_plus {
   position: absolute;
   /*right: 10px;*/
   bottom: 13px;
	z-index: 100;
   display: none;
   cursor: pointer;
   padding: 5px 10px;
   border: 2px solid #348def;
   border-radius: 10px;
   background-color: #348def;
   color: #fff;
}
#menu-admin {
  padding-top: 25px;
}
.menu-admin0 {
  display: flex; 
  flex-direction: column; 
  justify-content: space-between;
  height: 100%
}
.menu-admin {
	position:absolute;
	top:0px;
	left:-680px;
	width:260px;
	height: 100%;
	background-color: #ffffff;
	z-index: 99;
	border-right: 1px solid #ddd;
  	box-shadow: 3px 0px 3px #c6c6c652;
 	transition: left 1s linear;
}
#menu-admin li {
  /*border: 1px solid green; */
  border-radius: 3px;
  margin: 	10px;
  padding: 	20px;
  width: 	240px;
  text-align: left;
  background-color: #ffffff;
  color: #3a3a3a;
  font-size: 1.1em;
}
#menu-admin li:hover {
  cursor: pointer;
  color: #ffffff;
  background-color: #438DEF;
}
.margin-0-1em {
  margin: 0 1em;
}
.admin-logo-menu {
  display:flex;
  justify-content: space-between; 
  align-items:center; 
  padding-top:10px;
  margin-bottom: 10px
}
.menu-adm-account {
  height: 26px;
  max-height: 26px;
}
/* staff */
.staff-admin, .store-admin {
  display:  none; 
  /*margin: 20px auto; */
  max-width:  480px;
  padding:  1px;
  /*
  border-radius:  10px;
  border: 1px solid green; */
  position: fixed;
  top: 70px;
  bottom: 0px;
  overflow: auto;
  width: 100%;
}
.staff-content-my, .store-content-my, .km-content-my {
  list-style-type: none;
  border-radius:  12px;
  box-shadow:     0 0 12px rgba(173, 173, 173, .5);
}
.staff-content-my:nth-child(odd), .store-content-my:nth-child(odd) {
  /*background-color: #ededed;*/
}
.staff-row-first {
  border-top-left-radius:   12px;
  border-top-right-radius:  12px;
}
.staff-row-last {
  border-bottom-left-radius:  12px;
  border-bottom-right-radius: 12px;
}
.staff-row, .staff-row-caption, .store-row, .km-row {
  display: flex;
  align-items: center;
  min-height: 36px;
  border-bottom: 0.1em solid #c6c6c6;
  padding: 0 6px;
  background-color: #ffffff;
  font-size: 0.95em;
}
.staff-row:hover, .store-row:hover, .km-row:hover {
  background-color: #f3f3f3;
  color: #3A3A3A;
}
.staff-row-border {
  border: 1px solid #c6c6c6;
  border-radius: 4px;
}
.list-store {
  margin-bottom:40px;
}
.row-after-edit {
  background-color: #348def4f;
}

.user_name0,.user_name1,.user_name2,.user_name3,.user_name4 {
  font-size: 1em;
  width: 100%;
}
.store_name {
  font-size: 1em;
  width: 100%;
  padding: 4px 0;
}
.staff-img, .staff-img-L, .store-img, .store-img-L {
  width: 36px;
  margin-right: 16px;
  text-align: center;
  color: gray;
  font-size: 0.9em;
}
.login-name {
  width: 60px;
  color: gray;
  font-size: 0.9em;
  text-align: left;
}
.staff-img img, .staff-img-L img , .store-img img, .store-img-L img {
  cursor: pointer;
  height: 17px;
}
.staff-img : hover, .store-img : hover {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
}
.store_name {  padding-left: 10px; }
.user_name0 {  padding-left: 5px; }
.user_name1 {  padding-left: 15px; }
.user_name2 {  padding-left: 25px; }
.user_name3 {  padding-left: 35px; }
.user_name4 {  padding-left: 45px; }

.card-user {
  display: none;
  background-color: #ffffff;
  border-radius: 10px;
  /*border: 1px solid gray;*/
  text-align: center;
 /* margin: 2px auto 50px auto;
  position: fixed;
  top: 70px; */
  z-index: 100;
  margin: 12px;
}
.card-row {    /* викор у admin + report*/
  display:flex;
  padding:0 5px;
  align-items:center;
}
.card-row div {
  border-radius: 4px !important;
}
.card-field-caption {
  width:30%;
  text-align:right;
  padding-right:5px;
}

/* /ADMIN */

.my-font {
	font-family: ArialRoundedMTProCyr, Arial;
}

/* MESSAGE START */
.div_message {  /* for SCK */
  display:    none;
  margin-top:   10px;
  min-height:   72px;
  transition: height 1s;
}
.div_attach hr {
  display:none; 
  height: 1px;
  color:#d0d0d0;
  box-shadow: 0 0 4px #A5A5A5;
}
.div-attach-files {
  display: flex;
  margin: 5px 0;
}
.attach-file {
  height: 36px;
  margin-right: 5px;
}
.attach-file img {
  margin-left: auto;
  margin-right: auto;
  display: block;
  height: 100%;
  cursor: pointer;
  border-radius: 4px;
}
.div_root_mess {
  margin-bottom:  0px;
}
.div_txtmess {
  padding: 5px;
  left: 0px;
  right: 0px;
  background-color: #ffffff;
  font: 1em ArialRoundedMTProCyr, Arial, sans-serif;
  border-radius: 6px;
  border: 1px solid #c6c6c6 !important;
  position: relative;
  color: black;
  width: 100%;
  min-height: 66px;
  text-align: left;
}
.textarea-readonly {
  border-top: 1px solid #c6c6c6;
  border-bottom: 1px solid #c6c6c6;
  border-left:none !important;
  border-right:none !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  resize: none !important;
  overflow: auto !important;
  scrollbar-width: thin;
}
.textarea-edit {
  border: 1px solid #c6c6c6;
  border-radius:6px !important;
  box-shadow: none;
}
.txt-task {
  border: none;
  box-shadow: none;
  resize: none;
  text-shadow: none;
  font: 0.9em ArialRoundedMTProCyr, Arial, sans-serif;
  height: 75px;
  margin: 0;
  padding: 0 10px 0 5px;
}
.div-task-command {
  display:  flex;
  justify-content: flex-end;
  margin: 5px 0 2px 0;
  align-items: center;
}
.div-task-command p {
  display:none;
  margin-right:20px;
  color:#348def;
  font-size:0.9em;
}
.button-task-command {
  font-size: 0.8em;
  margin-right: 5px;
  color: rgb(88, 129, 147);
  font-weight: bold;
  line-height: 1.2;
}
.div-std-expr {
  display: none;
  border1: 1px solid #dddddd;
}
.list-expr {
  width: 100%;
  border1: 1px solid #dddd00;
  height: 96px;  
  position: relative;
}

.buttons-expr {
  width: 56px;
  border1: 1px solid #00dd00;  
  display: flex;
  flex-direction: column; 
  align-items: flex-end;
  justify-content: space-between;
}
.btn-expr {
  width: 32px;
  height: 20px;
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  background-position-x: center;
  background-position-y: center;
  background-size: 50%;
  background-repeat: no-repeat;
  cursor: pointer;
  margin: 0 10px;
  /*padding-top: 5px;*/
}
.button-hide {
  height: 0 !important;
  border: 0 !important;
}
.button-show {
  height: 20px;
  border: 1px solid #d0d0d0;
}
.btn-ok {
  padding-top: 5px;
  background-image: url(/img-kt/expr-button-ok.svg);
  background-color:#348def;
}
.btn-task-o {
  padding-top: 5px;
  background-image: url(/img-kt/task-o3.png);
  /*background-color:#348def;*/
}
.btn-task-tr {
  padding-top: 5px;
  background-image: url(/img-kt/task-trello.png);
  margin-left: 5px;
  margin-right: 20px;
  /*background-color:#348def;*/
}
.btn-task-h {
  padding-top: 5px;
  background-image: url(/img-kt/task-h3.png);
  margin-left: 5px;
  margin-right: 20px;
  /*background-color:#348def;*/
}
.btn-task-m {
  padding-top: 5px;
  background-image: url(/img-kt/task-m3.png);
  margin-left: 5px;
  margin-right: 20px;
  /*background-color:#348def;*/
}
.btn-task-i {
  padding-top: 5px;
  background-image: url(/img-kt/info.png);
  /*background-color:#348def;*/
}
.info-button {
  margin: 5px 0 2px 0;
}

.ul-list-expr {
  list-style-type: none;
  position: absolute;
  top: 0px;
  bottom: 0px;
  overflow: auto;
  width: 100%;
}
.expr-caption {
  font-size: 13.3px;
  color: rgb(79, 79, 79);
  font-weight: bold;
  line-height: 21px;
  border-bottom: 1px solid #F0F0F0;
  margin-right: 20px;
}
.expr-item {
  font-size: 15px;
  font-family: "Myriad Pro";
  margin-left: 5px;
  color: rgb(96, 96, 96);
  line-height: 20px;
  border-bottom: 1px solid #F0F0F0;
}
.ul-list-expr .expr-item : first-of-type {
  border-top: 1px solid #F0F0F0;  
}
.expr-item:hover {
  background-color: #ECF6FF;
}
.yellow-item {
  background-color: yellow;
}

.my-confirm {
  display: none;
  position: fixed;
  transform: all 2s;
  top: 100px;
  left: 100px;
  background-color: #fff;
  width: 300px;
  box-shadow: 0 0 9px 1px rgba(198, 198, 198, 0.755);
  border-radius: 15px;
  z-index: 99;
}
.my-confirm .query {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 43px;
}
.my-confirm .query .text {
  font-size: 15px;
  color: rgb(79, 79, 79);
  font-weight: bold;
  line-height: 1.2;  
  padding-left: 24px;
}
#id-alert .query .text {
  margin: 0 auto;
}
.my-confirm .query img {
  padding-right: 24px;
  height: 10px;
}
#id-create-task .row-images {
  display: flex;
}
#id-create-task .row-text, #id-alert .row-text {
  padding: 10px;
}
#id-alert .row-text textarea {
  font-size: 1em;
  font-weight: bold;
  resize: none;
}
.buttos-row {
  display:flex;
  align-items: center;
  justify-content:center;
  margin:7px 0;
}
.button-cancel {
  text-align:center;
  color:rgb(58,58,58);
  height: 48px;
  text-decoration: underline;
  cursor:pointer;
  margin-left:10px;
  margin-right: 18px;
  font-size: 0.9em;
  padding:0.98em 0;
}
.button-ok {
  border:0px solid;
  border-radius:5px;
  text-align:center;
  width:96px;
  background-color: #348def;
  color:#fff;
  height: 37px;
  margin-left: 32px;
  padding:0.6em 0;
  cursor:pointer;
  font-size: 0.9em;
}
.button-exit {
  border: 1px solid #979393;
  border-radius: 5px;
  text-align: center;
  width: 100px;
  background-color: #f2f4f6;
  color: #1f1d1d;
  padding: 4px 10px;
  cursor: pointer;
  font-size: 0.9em;
  margin: 10px auto;  
}

.div-one-task-std {
  padding: 0px 20px 10px 20px;
}
.div-one-task {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.camera {
    background-image: url(/img-kt/camera.png);
    width: 50px;
    height: 40px;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 20px;
}
#id-one-task{
  position: fixed;
  top:      60px;
  bottom:   0px;
  overflow: auto;
  display:  none;
  margin:   20px auto;
}
#id-one-task textarea::placeholder {
  color: #dddddd;
}
.one-task-border {
  padding: 5px 20px;
  border-bottom: 1px solid #c6c6c6;
  margin: 5px 20px;
}
.one-task-caption {
  font-size: 13px;
  padding-left: 10px;
}
.one-task-buttons {
  display:flex;
  align-items: center;
  justify-content:center;
  margin:15px 0;
}
.one-task-back {
  height: 48px;
  padding: 0.8em 0;
  margin-right: 10px;
  text-align:center;
  text-decoration: underline;
  cursor:pointer;
  color:rgb(58,58,58);
  font-size: 0.9em;
}
.one-task-write {
  height: 48px;
  width:96px;
  margin-left: 10px;
  padding:0.8em 0;
  border:0px solid;
  border-radius:5px;
  text-align:center;
  cursor:pointer;
  color:#e3e3e3;
  background-color: #348def;
  font-size: 0.9em;
}

/* MESSAGE STOP */

/* LOGIN */
.login {
	margin: 20px auto;
	max-width: 400px;
}

.app-logo {
  width: 33%;
  max-width: 150px;
  display: block;
	margin-left: 21px;
}
.margin-left-0 {
  margin-left: 0 !important;
}
.margin-bottom-30px {
  margin-bottom: 30px !important;
}
.height-16px {
  height: 16px;
}
.div-flex-center {
  display: flex;
  justify-content: center;
}
.your-logo img[alt*="front"] {
  padding: .2rem;
  border: 3px solid red;
}
.your-logo img {
  max-height: 100px;
  border-radius: 10px;
  margin-top: 5px; 
  font-size: 30px;
}
.login-screen {
	padding: 20px 20px;
	max-width: 100%;
	font-size: 1.2em;
}

.login-form {
	text-align: center;
}
.group {
	margin-bottom: 12px;
}
.group button {
	background-color: #438def;
	border-color: #ddd;
	color: #ffffff;
	border-radius: 30px;
	margin: 0 auto;
	width: 60%;
	padding: 10px;
	font-size: 1em;
	font-family: ArialRoundedMTProCyr, Formular, Arial;
  box-shadow: 0 0 6px rgb(201,201,201);
	border: none;
  font-size: 0.9em;
  font-weight: 300;
}
.group textarea:focus, .group input:focus {
  box-shadow: none !important;
}
.my-text {
  box-shadow: none;
  padding-left: 5px !important;
  height: 36px;
  width: 90px;
  border-radius: 3px;
  border: 1px solid rgb(220,222,226);
  font-size: 0.9em;
}
.login-field {
	font-family: ArialRoundedMTProCyr, Formular, Arial;
	text-align: center !important;
	background-color: #fcfcfc;
	border: 2px solid transparent;
	border-radius: 6px;
	font-size: 1em;
	font-weight: 200;
	padding: 10px 0 !important;
	transition: border .5s;
	color: #939393;
	box-shadow: 0 0 12px #b0adad;
	width: 80%;
}

input:focus {
	border: 2px solid #438def;
	box-shadow: none !important;
}
.login-man {
	height: 80px;
	margin: 50px auto 30px auto;
	transition: margin .5s;
}
.login-man img {
	max-height: 80px;
}
img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.btn {
  border: 2px solid transparent;
  background: #5ec6a1;
  color: #ffffff !important;
  font-size: 16px;
  line-height: 25px;
  padding: 10px 0;
  text-decoration: none;
  text-shadow: none;
  border-radius: 3px;
  box-shadow: none;
  transition: 0.25s;
  display: block;
  width: 250px;
  margin: 0 auto;
  margin-bottom:10px;
}

.btn:hover {
  background-color: #9abf59 !important; 
  border 1px solid red !important;
  color: red;
}

.ss-main .ss-single-selected, .ss-main .ss-multi-selected {
  min-height: 36px;
}

/* RADIO BUTTON */
.div-space-between {
  display:flex;
  justify-content:space-between;
}
.font-size0-9 {
  font-size:0.9em;
}
.font-size1-1 {
  font-size:1.1em;
}
.div-row-bottom {
  display:flex;
  justify-content:space-between;
  margin-top:5px;
}
.div-radio {
  height: 26px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.div-radio-icons {
  display:flex;
  justify-content:space-between;
  margin-left:10px;
  margin-bottom:5px;
}
.div-radio input {
  margin-left: 10px;
  font-size: 20px;
}
.div-radio1 {
  display: flex;
  height: 26px;
}
.div-radio1 label{
  height: 0;
}
.radio {
  position: relative;
  cursor: pointer;
  line-height: 30px;
  font-size: 14px;
  margin: 15px;
  margin-top: 7px;
  margin-right: 15px !important;
}
.radio .label0, .radio .label, .radio .label1, .radio .label2{
  position: relative;
  display: block;
  float: left;
  margin-right: 0px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border: 1.5px solid #E0E0E0;
  border-radius: 100%;
  -webkit-tap-highlight-color: transparent;
  text-align: center;
  font-size: 0.9em;
  padding-top: 1px;
  font-weight: 700;
}
.radio .gruppe, .radio .gruppe1, .radio .gruppe2 {
  position: relative;
  display: block;
  float: left;
  margin-right: 0px;
  width: 24px;
  height: 24px;
  border: 0px solid #808080;
  background-color: #F2F2F2;
  border-radius: 100%;
  -webkit-tap-highlight-color: transparent;
  text-align: center;
  font-size: 0.9em;
  padding-top: 1px;
  font-weight: 700;
  line-height: 24px;
  color: black;
}
.radio .label0 {
  color: #60C943;
  border-color: green;
}
.radio .label {
  color: #60C943;
}
.radio .border {
  border-color: #60C943;
}
.radio .label1 {
  color: #FFC31A;
}
.radio .border1 {
  border-color: #FFC31A;
}
.radio .label2 {
  color: #F45E45;
}
.radio .border2 {
  border-color: #F45E45;
}
.radio .label05:after, .radio .label:after, .radio .label1:after, .radio .label2:after { 
  content: '';
  position: absolute;
  top: 6px;
  left: 6px;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  background: green;
  transform: scale(0);
  transition: all 0.2s ease;
  opacity: 0.08;
  pointer-events: none;
  background-color: #60C943;
  padding: 4px; 
}
.radio .label1:after {
    background: #FFC31A !important;
}
.radio .label2:after {
    background: #F45E45 !important;
}
.radio:hover .label0:after, .radio:hover .label:after, .radio:hover .label1:after, .radio:hover .label2:after  {
  transform: scale(1);
}
input[type="radio"]:checked + .label0 {
  background-image: url('/img-kt/check-green.svg');
  background-position-x: center;
  background-position-y: center;
  background-size: 60%;
  background-repeat: no-repeat;
  background-color: #F9F9F9;
  border-color: green;
}
input[type="radio"]:checked + .label {
  background-image: url('/img-kt/check-green.svg');
  background-position-x: center;
  background-position-y: center;
  background-size: 60%;
  background-repeat: no-repeat;
  background-color: #F9F9F9;
  border-color: #AFAFAF;
}
input[type="radio"]:checked + .label1 {
  background-image: url('/img-kt/check-yellow.svg');
  background-position-x: center;
  background-position-y: center;
  background-size: 60%;
  background-repeat: no-repeat;
  background-color: #F9F9F9;
  border-color: #AFAFAF;  
}
input[type="radio"]:checked + .label2 {
  background-image: url('/img-kt/check-red.svg');
  background-position-x: center;
  background-position-y: center;
  background-size: 60%;
  background-repeat: no-repeat;
  background-color: #F9F9F9;
  border-color: #AFAFAF;  
}
.gruppe-active {
  border: 1.5px solid #60C943;
  background: none;
}
.gruppe1-active {
  border: 1.5px solid #FFC31A;
  background: none;
}
.gruppe2-active {
  border: 1.5px solid #F45E45;
  background: none;
}

.cntr {
  position: absolute;
  top: calc(50% - 10px);
  left: 0;
  width: 100%;
  text-align: center;
}
.hidden {
  display: none;
}

.is-value {
  border-bottom: 1px solid red;
}
.load_file_anim {
  display: none;
  text-align: center;
  /*padding-top: 100px;*/
  z-index: 125;
  width:  100px;
  position: absolute;
}
.my-gallery {
  display: none;
  width: 100%;
  height: 100%;
}
/*
.my-gallery img {
  height: auto;
  max-height: max-content;
  max-width: 100%;
}
*/
input[type="radio"][readonly] {
  pointer-events: none;
}
/* /RADIO BUTTON */

/* NEW MONITORING  НОВИЙ ЧЕКЛИСТ */
#id-new-trip, #id-new-packet {
  display:none; 
  margin: 0 12px; 
  padding: 20px 12px; 
  height:100%;
  text-align:center;
  align-items:center; 
  flex-direction:column;
  background-color:#ffffff;
  overflow: auto;
  scrollbar-width:thin;
  max-width: 480px;
}

#id-new-trip * {
    font-family: ArialRoundedMTProCyr, Arial;  
}
/*
#id-new-trip .group {
    margin-bottom: 30px !important;  
}
*/
#id-new-trip textarea {
  box-shadow:none;
  font-size: 0.9em;
  height:5em;
  border-radius:8px;
}
#id-new-trip .ui-input-text {
  border-radius: 4px;
  box-shadow: none;
}

#dialog_start {
  display:none;
  max-width:450px;
  height:100%;
  margin:0 auto;
  padding: 0 20px;
  position:relative;
  font-family: ArialRoundedMTProCyr !important;
  text-shadow: none;
}
.margin-bottom-10px {
  margin-bottom: 10px;
}
.margin-bottom-5px {
  margin-bottom: 5px;
}
.div-sel-dir, .div-sel-tags {
  display: flex;
  justify-content: center;
  width: 100%;
  align-items: center;
}
.div-sel-dir select, .div-sel-tags select {
  width:100%;
  height: 36px;
  font-size: 1em;
}
.div-date-mntr {
  display:flex;
  align-items: center;
  justify-content: center;
}
.div-sel-staff {
  display:flex;
  align-items: center;
}
.div-sel-staff img {
  margin-right:10px;
  height:16px;
}
.div-sel-staff select {
  font-size: 0.9em;
  min-height:36px;
}
.div-sel-kind, .div-button-new-checkl {
  display:flex;
  align-items: center;
  justify-content: space-between;
}
.div-sel-kind select {
  width:60%;
  min-height:36px;
  font-size: 1em;
}
.div-cash-key, .div-cash-param {
  display:flex;
  align-items: center;
  justify-content: center;
}
.div-cash-key img {
  margin-left:10px;
  height:8px;
}
.padding-0-5px {
  padding: 0 5px;
}
.color-198-198-198 {
  color:rgb(198,198,198);
}
.div-cash-param img {
  height:16px;
  margin-right:10px;
}
.div-cash-param input {
  width: 80px;
  background-color: #ffffff;
}
.div-button-1-2 {
  width:46%;
  border:0px solid;
  border-radius:5px;
  text-align:center;
}
.div-button-back {
  width:100% !important; 
  height: 48px;
  color:rgb(58,58,58) !important;
  background-color:#f9f9f9 !important;
}
.div-button-create {
  width:100% !important;
  height: 48px;
  background-color: #348def !important;
  color:#e3e3e3 !important;
  text-shadow: none !important;
}
.annul-checkl {
  width: 90%;
  margin: 0 auto;
  padding: 0 30px;
  border:0px solid;
  border-radius:5px;
  text-align:center;
}
.annul-checkl button {
  width:90%;
  height: 40px;
  padding: 0 20px;
  background-color: #348def;
  color:#e3e3e3;
  text-shadow: none;
}

@media screen and (max-height: 650px) {
  #id-new-trip {
    padding: 5px 5%; 
  }
  #id-new-trip textarea {
    height:2.5em;
  }
  .footer-height {
    height: 46px;
  }
  .header-height {
    height: 50px;
  }
  .staff-admin, .store-admin {
    top: 50px;
  }
  .menu-admin-item {
	line-height: 3.0em;
  }
}

@media screen and (max-height: 610px) {
  .menu-admin-item {
	line-height: 2.85em;
  }
}

/*
@media screen and (max-height: 566px) {
  #id-new-trip .group {
    margin-bottom: 15px !important;
  }  
}*/
@media screen and (max-height: 570px) {
  .button-new-s4 {
    margin: 12px auto; 
  }
  .root-menu-row {
    margin-top:10px;
  }
  .your-logo {
    height: 100px;
  }
  #id-new-trip textarea {
    height:2.5em;
  }
  #id-new-trip .group {
    margin-bottom: 10px !important;
  }
  .menu-admin-item {
	line-height: 2.7em;
  }
}
@media screen and (max-height: 530px) {
  /*.your-logo > img:nth-child(1) {
    margin-top: 30px;
  } */
  .button-new-s4 {
    margin: 20px auto; 
  }
  #dialog_start > div:nth-child(3) {
    margin-bottom: 15px;
  }
  .root-menu-row {
    margin-top:10px;
  }
  .your-logo {
    height: 100px;
  }
  .menu-admin-item {
	line-height: 2.45em;
  }
}
@media screen and (max-height: 510px) {
  .your-logo > img:nth-child(1) {
	visibility: hidden;
  }
  #dialog_start > div:nth-child(3) {
/*margin-top: 15px;*/
  margin-bottom: 14px;
  height: 12px;
  }
  
  .mini-docum {
	display: none;  
  }
  .menu-admin-item {
	line-height: 2.3em;
  }
}

#id-new-comment, #id-p-comment::placeholder {
  color: #dddddd;
}

.caption-field {
  font-size: 0.9em;
  color: #606060;
  line-height: 1.2;
  text-align: left;
  margin-right: 10px;
}
.ss-my {
  display: flex;
  cursor: pointer;
  width: 10em;
  height: 36px;
  padding: 4px;
  font-family1: 'Myriad Pro', Arial;
  font-size: 0.9em;
  border: 1px solid #dcdee2;
  border-radius: 4px;
  background-color: #fff;
  outline: 0;
  box-sizing: border-box;
  transition: background-color .2s;
}

.ss-my::-webkit-calendar-picker-indicator {
  display: none; 
  opacity: 1;
  background: url(//www.gravatar.com/avatar/cbfaff96665b7567defe1b34a883db8b?s=16&d=identicon&r=PG) no-repeat center;
  background-color: #ffffff;
  background-size: contain;
}
.ss-my::-webkit-inner-spin-button { display: none; }

/* /NEW MONITORING */


.body,
.wrapper {
  /*position: absolute;*/
  top: 0px;
  width: 100%;
  height: 100%;
  margin: 0;
  overflow-y: hidden;
}

.body {
  z-index: 1;
}

.wrapper {
  z-index: 2;
}

.card-formula {
 /* background-color: #eef5e3;
  background-image: url('/img/photo.jpg');
  background-position: center;
  background-size: cover; */
  border-radius: 5px;
  border: 1px solid gray;
  text-align: center;
  max-width: 480px;
  margin: 2px auto;
}
.formula-row {
  display:flex;
  font-size: 0.8em;
  padding:2px 5px;
  align-items:center;
}
#dialog-formula .caption {
  font-size: 0.8em;
  color: #a6a6a6;
  margin-left: 1em;
}
#dialog-formula {
  padding: 0.1em 0.2em;
}
.ui-dialog {
  background-color: white !important;
  border-radius: 12px;
}
.attach-icon-file {
  height: 32px;
  margin: 1px 5px;
  cursor: pointer;
  border-radius: 4px;
}
/*
#id-list-icon img {
  max-height: 30px;
  width: 30px;
  margin-right: 5px;
}
#id-list-icon {
  overflow: auto;
  font-family: ArialRoundedMTProCyr, Formular, Arial;
}
*/
#id-list-icon li {
/*  line-height: 32px;*/
  list-style-type: none;
/*  font-size: 1em;*/
}

#id-bottom-div button {
  font-family: ArialRoundedMTProCyr, Formular, Arial;
  font-size:0.9em;
}
#id-bottom-div div {
  text-align:center;
  margin:5px;
}
#id-new-icon {
  text-align: center;
}
#id-new-icon button {
  padding: 2px 10px;
  border-radius: 4px;
  border: 1px solid gray;
  margin: 10px auto;
}
#id-ind-name a {
  font-family: ArialRoundedMTProCyr, Formular, Arial;
  text-decoration:none;
  font-size:0.9em;
  color:#348def;
  font-weight: normal;
  padding: 0 5px;
}
.next-page {
  margin-bottom: 10px;
  padding: 6px 12px;
  border-radius: 6px;
  color: #348def;
  font-size: 1em;
  border: 1px solid #c6d9ed;
  background-color: transparent;
}
.ss-main .ss-multi-selected {
    height: auto;
}
.flex_checkbox {
  justify-content: center;
  display:    flex;
  color: rgb(198,198,198);
}
#div-upd-staff1 .ss-option {
  height: 24px; 
  font-size: 0.9em;
  padding: 2px 10px;
}

.ind-row-indst, .ind-row-standard {
  list-style-type:none;
  font-size: 0.9em;
  min-height: 24px;
  margin: 2px auto;
  padding-left: 2px;
}
.ind-row-indst:hover, .ind-row-standard:hover {
  cursor: pointer;
  background-color: #ccf8f6;
}

#id-list-indst li:nth-child(2n),  #id_content_km99 li:nth-child(2n), #id-list-ind-check li:nth-child(2n),  #id-list-standard li:nth-child(2n) {
  background: #dfdfdf; 
}
#id-list-indst li:nth-child(2n+1),  #id_content_km99 li:nth-child(2n+1), #id-list-ind-check li:nth-child(2n+1),  #id-list-standard li:nth-child(2n+1) {
  background: #e8e8fb; 
}
/* edit kind of checklist */
#div-list-users, #div-list-users-store, #div-list-stores1 {
  display: none;
  max-height: 300px;
  overflow: auto;
}
/*#id-list-users {
  max-height: 300px;  
}
#id_group_content .ind-row-tag {
  background: #0fdfdf;
}*/

/* налаштування: рівень виводу фото */
#id-photo-levels-button {
  width: 70px;
}

.name_monitoring {
  font-size:14px;
  font-weight:300;
  color:#606060;
}
.margin_0_15px {
  margin: 0 15px;
}
.height_30px {
  height:30px;
}
.text_align_center {
  text-align: center;
}
.font_size_065em {
  font-size: 0.65em;
}
.importance {
  color:red;
  font-weight:700;
  padding-right:5px;
}
/* filter */
.root-filter {
  display: none;
  min-height: 450px !important;
}
.root-filter .my-field {
  padding: 0.1em;
  font-size: 0.8em;
}
.root-filter .card-row {
  padding: 0;
}
/* /filter */

#ui-datepicker-div {
  font-size: small;
}


/* custom style for ui-dialog 21/12/2020 */
.ui-dialog .ui-dialog-titlebar-close {
  background-image: url('/img-kt/cross.png') !important;
  background-position: center;
  background-size: contain;
/*  width: 32px;
  height: 32px;
  top: .1em; */
  margin: 0;
  z-index: 555;
  top: 33%;
  width: 0px;
  height: 0px;
}
.ui-dialog .ui-dialog-titlebar-close .ui-icon-closethick {
  height: 0;
  width: 0;
}
/*
.ui-corner-all {
  border-radius: 20px;
}*/
.ui-widget-header {
  background-image: none;
  background-color: #ffffff;
  font-size: 0.9em;
  color: #4f4f4f;
  border: 1px solid #C6C6C6;
}
.ui-dialog-titlebar {
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.ui-dialog-title {
  font-size: 1em;
  font-family: ArialRoundedMTProCyr, Formular, Arial;
  margin-left: 0.3em;
  margin-top: 0.2em;
  margin-bottom: 0.2em;
//  width: 80%;
}

.ui-dialog-titlebar .ui-button {
  background-color: #ffffff;
  background-image: none;
  border: none;
}
.ui-dialog-content {
    background-color: #ffffff !important;
}

.ui-button .ui-icon {
  background-image: url("/img-kt/cross.svg");
  width: 32px;
  margin: 0;
  height: 32px;
  left: -28px;
  background-position: center;
  background-size: 50%;
}

.ui-button .ui-icon {
  background-image: none !important;
  background-color: white !important;
}

.ui-button:hover .ui-icon, .ui-button .ui-icon:hover, .ui-button:focus .ui-icon, .ui-button .ui-icon:focus {
  background-image: url("/img-kt/cross.svg");
/*  width: 24px;
  height: 24px;
  padding: 4px;
  border: 1px solid red;*/
}

.ui-dialog .ui-dialog-titlebar {
  padding-right: 0px;
}

.ui-shadow-inset {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
/*
.ui-dialog .ui-dialog-titlebar-close {
     left:auto;
}
*/
.div-button {
  display:flex; 
  justify-content:space-around; 
  align-items:center;
}
.div-button-cancel {
  font-size:0.9em;
  color:#393939;
  text-decoration: underline;
  cursor:pointer;
  font-family: ArialRoundedMTProCyr, Formular, Arial;
}
.div-button-go {
  font-size:0.9em;
  background-color: #438DEF;  
  color: #ffffff;
  cursor:pointer;
  font-family: ArialRoundedMTProCyr, Formular, Arial;
}

/* перемикач */
.toggle-switch {
  margin:6px 0;
}
.toggle-switch label {
  position:relative;
  display:block;
  width:30px;
  height:12px;
  background:#ddd;
  cursor:pointer;
  border-radius:6px;
  transition:all 300ms ease-in-out;
  font-size: 0px;
}
.toggle-switch label:after {
  content:"";
  position:absolute;
  width:16px;
  height:16px;
  background:#eee;
  top:50%;
  left:0px;
  transform:translateY(-50%);
  border-radius:50%;
  /*box-shadow:inset 0px 0px 1px 1px #ddd;*/
  transition:all 300ms ease-in-out;
}
.toggle-switch input:checked + label:after {
  left:calc(30px - 12px);
}

.toggle-switch input#toggle-switch-oplata:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#toggle-switch-oplata:checked + label:after {
  background:#348def;
}
.toggle-switch input#toggle-switch-trip:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#toggle-switch-trip:checked + label:after {
  background:#348def;
}
.toggle-switch input#id-card-is-adm:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#id-card-is-adm:checked + label:after {
  background:#348def;
}
.toggle-switch input#id-card-is-rep:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#id-card-is-rep:checked + label:after {
  background:#348def;
}
.toggle-switch input#id-only-camera:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#id-only-camera:checked + label:after {
  background:#348def;
}
.toggle-switch input#toggle-switch-attach:checked + label {
  background:rgb(157,213,255);
}
.toggle-switch input#toggle-switch-attach:checked + label:after {
  background:#348def;
}

.toggle-switch input {
  display:none;
  cursor: none;
}

.info-helper {
  width: 26px;
  height: 26px;
  /*margin: 2px 5px; */
  background-size: contain;
  background-position: center;
  background-image: url('https://kt.iperun.com/img-kt/info.svg');
}
.info-helper::before {
   content: attr(data-title); /*помещаем подсказку в псевдоэлемент*/
   display: none; /*скрываем подсказку*/
}
.info-helper:focus::before {
   display: block;
}

.support {
  display: inline-block;
  position: relative; /*обязательное параметр*/
  text-decoration: none;
  cursor: pointer;
  margin-left: 5px;
}

.support em {
  background: #348def;
  border-radius: 50%;
  border: 1px solid #999;
  text-align: center;
  color: #ffffff;
  font: normal bold 16px Arial;
  padding: 0 6px;
  user-select: none;
}
.tip, 
span.support::before/*если используется атрибут data-title*/ {
   display: none;
   position: absolute;
   z-index: 9998;
   /*top: 0;*/
   right: 10px;
   background: #F6F6F6;
   text-align: left;
   color: #555;
   cursor: default;
   padding: 5px;
   margin: -15px 0 0 10px; /*регулирует положение, значения зависят от применяемой конструкции*/
   max-width: 320px;
   min-height: 30px;
   height: auto;
   border-radius: 8px;
}

a.support:focus + .tip-block .tip {
  display:block;
}
#id-card-user hr {
  color: #c6c6c6;
  margin: 10px;
  background-color: #c6c6c6;
  border: 0 none;
  height: 0.01em;
}

.list-ind-icon {
  height: 32px;
  padding: 1px;
}
.list-ind-icon:hover {
  padding: 0px;
  border: 1px solid #348def;
  border-radius: 2px;
}
.display-none {
  display: none;
}
.ui-tooltip, .arrow:after {
/*  background: #f0f0f0;*/
  background: rgb(67,141,239,0.3);
  border: solid 1px #438def !important;
}
.ui-tooltip {
  padding: 4px 8px;
  color: black;
  border-radius: 4px;
  font-size: 14px;
}
.div-history {
  display: none;
}
.sun-editor-editable {
  max-width: 480px;
  margin: 0 auto;
}
.mini-docum {
  margin-top: 50px;
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.mini-docum a, .mini-docum a:visited{
  text-decoration: none;
  font-size: 1em;
  font-weight: 200;
  color: #c6c6c6;
}
.first-message {
  position: fixed;
  top: 70px;
  left: 20px;
  right: 20px;
  display: none;
  text-align: center;
  color: white;
  font-weight: 700;
  background-color: #fc1938;
  border: 1px solid;
  /*border-radius: 5px;*/
  padding: 20px 10px;
  z-index: 255;
}

.ui-page {
margin: 0 auto !important;
max-width: 480px;
position: static !important;
}
/*.ui-mobile [data-role="page"], .ui-mobile [data-role="dialog"], .ui-page {
position: static;
}*/
#id-header-ntrip {
  margin: 0 10px;
}
#id-header-dtrip {
  
}