/* v.4.0.alpha */

/* Блоки и сплитеры */
.spliter.vertical {
    background:url(../images/forms/spliter-v.png) no-repeat 50% 50%;
    cursor:w-resize;
    z-index:50;
}
.spliter.horisontal {
    background:url(../images/forms/spliter-h.png) no-repeat 50% 50%;
    cursor:n-resize;
    z-index:50;
}
.spliter {position:absolute;}

.block {
    position:absolute;
    z-index:0;
}
.form.popup {
    position:absolute;
    z-index:220;
    background:#eee;
    left:20px; top:20px; right:20px; bottom:20px;
    box-shadow:1px 2px 2px rgba(0,0,0,0.4);
    border-radius:3px;
    border:10px solid #eee;
    display:none;
}
.form.popup.fsize-0 {
    left:10%;
    top:20px;
    right:10%;
    bottom:20px;
}
.form.popup.fsize-1 {
    left:10%;
    right:10%;
    top:10%;
    bottom:10%;
}
.form.popup.fsize-2 {
    left:20%;
    right:20%;
    top:20%;
    bottom:20%;
}
.form.popup.fsize-3 {
    left:25%;
    right:25%;
    top:25%;
    bottom:25%;
}
.form.popup.fsize-4 {
    left:30%;
    right:30%;
    top:30%;
    bottom:30%;
}
.form.popup.fsize-5 {
    left:35%;
    right:35%;
    top:35%;
    bottom:35%;
}
.form.notabs .top {top:0;}
.form.notabs .container {top:48px;}
#popup_back {
    position:fixed;
    z-index:200;
    background:rgba(0,0,0,0.4);
    left:0; top:0; right:0; bottom:0;
    display:none;
}

/* Диалог */
.form.popup.dialog > .title .btns {
    float:right;
}
.form.popup.dialog > .title h3 {
    float:left;
    font:18px Roboto;
    line-height: 35px;
    margin-left:10px;
    color:#777;
}
.form.popup.dialog > .title {
    position:absolute;
    left:0;
    right:0;
    overflow:hidden;
    top:0;
    height:40px;
    background:url(../images/forms/menu_bottom.png) repeat-x 0 100%;
}
.form.popup.dialog .container {
    bottom:0;
    top:40px;
}

/* Формы */
.form .tabs,
.form .tabs-cont,
.form .top,
.form .container,
.form .fields,
.form .bottom {
    position:absolute;
    left:5px;
    right:5px;
    overflow:hidden;
}
.form .container,
.form .fields {
    top:85px;
    bottom:40px;
    display:none;
    overflow:auto;
}
.form .tabs-cont {
    top:80px;
    left:0;
    right:0;
    bottom:40px;
    overflow:auto;
}

.form textarea.content:focus {
    background:white;
}
.form textarea.content {
    width:100%;
    height:100%;
    box-sizing: border-box;
}
.form textarea.mono {
    font:14px monospace;
}

.form .tabs div:hover {
    background:white url(../images/forms/menu_bottom.png) repeat-x 0 100%;
}
.form .tabs div img {
    vertical-align:middle;
    margin:-4px 5px 0 0;
}
.form .tabs div.disabled:hover {background:none;}
.form .tabs div.disabled {color:#999;}
.form .tabs div.disabled img {opacity:0.4;}
.form .tabs div.select {
    border:1px solid #aaa;
    border-bottom:none;
    background:#eee url(../images/forms/button_top.png) repeat-x;
    padding:2px 7px 0;
}
.form .tabs div {
    border-radius:3px 3px 0 0;
    display:inline-block;
    position:static;
    line-height:27px;
    height:27px;
    padding:3px 8px 0;
    cursor:pointer;
}
.form .tabs {
    top:0;
    height:30px;
    background:url(../images/forms/menu_bottom.png) repeat-x 0 100%;
    white-space: nowrap;
    overflow-x: auto;
}

.form .top .buttons,
.form .top .title {
    position:absolute;
    top:0;
    bottom:0;
}
.form .bottom button,
.form .top .buttons button {display:none; margin-left:5px;}
.form .top .buttons {
    padding-top:2px;
    right:0;
    width:440px;
    text-align:right;
}
.form .top .title {
    left:0;
    right:440px;
    overflow:hidden;
    white-space:nowrap;
    font-size:20px;
    line-height:40px;
    color:#777;
}
.form .top {
    top:37px;
    height:34px;
}

.form .bottom {
    right:5px;
    bottom:0;
    height:34px;
    text-align:right;
}

div.form {position:absolute; border-radius:3px; overflow-x:hidden; overflow-y:auto; z-index:0; top:50px; bottom:50px; left:10px; right:10px;}
div.form .forbidden {background:url("../images/medium/forbidden.png") no-repeat 50%;}
div.form .forbidden > div {position:absolute; left:5px; top:5px; right:5px; bottom:5px; border:1px solid rgba(0,0,0,0.1); border-radius:3px;}
div.form div.field {position:absolute; overflow:visible;}
div.form button.auto {min-width:0; font-size:11px; padding:0 3px; height:15px; display:inline-block; vertical-align:top; border-radius:3px;}
div.form u.input > * {
    box-sizing: border-box;
    width:100%;
    height:100%;
}
div.form u.input {
    position:absolute;
    left:5px; bottom:0; right:5px; top:25px;
    padding:0;
    overflow:visible;
    text-decoration:none;
    vertical-align:middle;
    box-sizing: border-box;
}
/*div.form u.input div {position:static;}*/
div.form u.date {}
div.form a.date {
    position:absolute; left:5px; bottom:5px; right:5px; top:25px;
    padding:4px 0 0 37px;
    background:url("../images/icons/calendar.png") no-repeat 5px 50%,
                url("../images/forms/button_bottom.png") repeat-x 0 100%,
                #eee url("../images/forms/button_top.png") repeat-x;
    border-radius:3px;
    border:1px solid #7e7e7e;
    cursor:pointer;
}
div.form u.input input, div.form u.input textarea {width:100%; height:100%; font-size:16px;}
div.form span.left {position:absolute; left:5px; top:5px; height:16px; overflow:hidden; font-size:14px; color:#333;}
div.form span.right {position:absolute; top:5px; right:5px; height:16px; overflow:hidden;}
div.form span.help:hover {
    background-position:0 100%;
}
div.form span.help {
    background:url("../images/icons/help.png") no-repeat;
    width:15px;
    height:15px;
    display:inline-block;
    margin:0;
}

/* блок размера/формата */
div.form u.input.size > div {right:-10px; width:45%;}
div.form u.input.size > span {left:25%;width:5%; text-align: center; line-height: 30px;}
div.form u.input.size > input {left:30%;width:25%;}
div.form u.input.size > input:first-child {left:0;}
div.form u.input.size > * {
    position: absolute;
    display: block;
    top:0;
    height: auto;
    bottom:-8px;
    overflow: visible;
    box-sizing: border-box;
}

/* инфоблок */
.infolist {margin:5px 0;}
.infolist tr td:first-child {color:#444;}
.infolist tr td {font-size:16px; padding:4px 5px;}

/* Чекбоксы */
.field-bool > span {
    cursor:pointer;
    display:inline-block;
}
.field-bool > span > div {
    display:inline-block;
    width:26px;
    height:26px;
    vertical-align:middle;
    background:url(../images/forms/checkbox.png) no-repeat 0 100%;
    cursor:pointer;
}
.field-bool > span:hover > div {background-position:100% 100%;}
.field-bool > span.checked > div {background-position:0 0;}
.field-bool > span.checked:hover > div {background-position:100% 0;}

.inlineform .field-bool > span > span {display:none;}

/* размер */
.field-size-list,
.field-size {
    position: absolute;
    top:0;
    bottom:0;
}
.field-size > i,
.field-size > span {
    position: absolute;
    left:0; top:0;
    bottom:0; right:10px;
    box-sizing: border-box;
    overflow: hidden;
}
.field-size > span input {
    box-sizing: border-box;
    width:100%;
}
.field-size > i {
    left:auto;
    top:50%; margin-top:-8px;
    right:0; width:10px;
    line-height:16px;
    height:16px;
    font-style: normal;
    text-align: center;
    font-size:12px;
}
.field-size-list {
    margin-left:-5px;
}

/* списки */
.field-list {
    height:100%;
}
.field-list > div > i,
.field-list > div > span {
    position: absolute;
    left:0; right:30px;
    top:0; bottom:0;
    overflow:hidden;
    line-height: 100%;
    padding:7px 5px;
}
.field-list > div:hover {
    background-color:rgba(255,255,255,0.8);
}
.field-list > div > i {
    left:auto;
    right:0;
    width:30px;
    background:url(../images/forms/drop-arrow.png) no-repeat 50% 50%;
    border-left:1px solid rgba(0,0,0,0.2);
    padding:0;
}
.field-list.clist > div > i {
    background:url(../images/forms/drop-more.png) no-repeat 50% 50%;
}
.field-list.date > div > i {
    background:url(../images/icons/calendar.png) no-repeat 50% 50%;
}
.field-list > div {
    position: relative;
    box-sizing: border-box;
    height:100%;
    border:1px solid #aaa;
    border-bottom:1px solid #777;
    background:#f4f4f4 url(../images/forms/button_top.png) repeat-x;
    border-radius:3px;
    padding-left:7px;
    white-space:nowrap;
    cursor: pointer;
}
div.field-list-cont > div:hover {background:#deedf7;}
div.field-list-cont > div.sel {background:#9fc5e2;}
div.field-list-cont > div .grey {color:#777;}
div.field-list-cont > div {
    padding:7px;
    border-radius:3px;
    min-width:100px;
    font-size:100%;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
}
.inlineform .field-list > div.field-list-cont > div {font-size:100%; padding:4px 5px;}
.field-list > div.field-list-cont {
    position: absolute;
    background:white;
    padding:1px;
    margin-top:-1px;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
    top:100%;
    height:auto;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 500;
    display: none;
    max-height: 500px;
}
.field-list > div.loading span {
    top:50%;
    bottom:auto;
    width:auto;
    left:10px;
    right:40px;
    padding:0;
}
div.field-list-cont > div.empty {
    font-size:14px;
    color:#999;
    background: none;
    padding:5px 10px;
}
div.field-list-cont > div.loading span {width:80%;}
div.field-list-cont > div.loading {
    width:100px;
    height:18px;
}
.field-list-drop {
    display: none;
    position: absolute;
    left:100px;
    top:100px;
    min-width:100px;
    max-width:500px;
    max-height:300px;
    margin-top:-2px;
    background:white;
    overflow-x: hidden;
    overflow-y: auto;
    z-index:2000;
    border-radius:3px;
    border:1px solid #999;
    box-shadow: 0 2px 2px rgba(0,0,0,0.2);
}
.inlineform .fast-actions > div {
    padding:0 5px;
}
.inlineform .fast-actions {
    text-align:right;
    min-width:50px;
    width:50px;
}

/* Асинхронный список */
/*
.asynclist .block .tools_cont .search {
    top:-5px;
}
.asynclist .block {
    left:5px; right:5px;
    bottom:5px; top:10px;
}
.asynclist.showed .asl-popup {
    display:block !important;
}
.asynclist .asl-popup {
    display:none;
    position: absolute !important;
    background:#f4f4f4;
    width:400px;
    height:300px;
    box-shadow:0 2px 5px rgba(0,0,0,0.3);
    border:1px solid #777;
    border-top:none;
    border-radius:0 0 3px 3px;
    z-index:1000;
}
.asynclist > span {
    background:url(../images/forms/drop-arrow.png) no-repeat 50% 50%,
                #eee url(../images/forms/button_top.png) repeat-x;
    width:30px;
    height:26px;
    margin:0px 0 0 -30px;
    border-radius:0 3px 3px 0;
    display:inline-block;
    vertical-align:middle;
    position:absolute;
}
.asynclist > i {
    display:inline-block;
    width:100%;
    line-height:26px;
    height:26px;
    overflow:hidden;
    vertical-align:middle;
    font-size:16px;
    font-style:normal;
}
.asynclist {
    display:inline-block;
    min-width:120px;
    width:100%;
    padding-left:7px;
    white-space:nowrap;
    border-radius:3px;
    border:1px solid #aaa;
    border-bottom:1px solid #777;
    background:#eee url(../images/forms/button_top.png) repeat-x;
    border-radius:3px;
    overflow:hidden;
    cursor:pointer;
}

.bsynclist > i.loading,
.asynclist > i.loading {text-align:center;}
.bsynclist > i.loading > span,
.asynclist > i.loading > span {
    height:100%;
    width:40%;
    min-width:100px;
    background:url(../images/face/loader-line.gif) repeat-x 50% 50%;
    display:inline-block;
}*/

/* --- */
.bsynclist > span {
    width:30px;
    height:100%;
    min-height:26px;
    margin:0px 0 0 -31px;
    border-radius:0 3px 3px 0;
    display:inline-block;
    vertical-align:middle;
    position:absolute;
    text-align: center;
    line-height: 26px;
    border-left:1px solid #999;
    background: #eee url(../images/forms/button_top.png) repeat-x;
}
.bsynclist > i {
    display:inline-block;
    width:100%;
    line-height:150%;
    height:100%;
    overflow:hidden;
    vertical-align:middle;
    font-size:16px;
    font-style:normal;
}
.bsynclist {
    display:inline-block;
    width:100%;
    height:100%;
    min-height:26px;
    padding-left:7px;
    white-space:nowrap;
    border-radius:3px;
    border:1px solid #aaa;
    border-bottom:1px solid #777;
    background:#eee url(../images/forms/button_top.png) repeat-x;
    border-radius:3px;
    overflow:hidden;
    cursor:pointer;
}

/* Выпадающий список */
/*
.selectbox select {
    display:none;
}
.selectbox > div span:hover {
    background:#9fc5e2;
    color:black;
}
.selectbox > div span.sel i {
    background:white url(../images/forms/checkox.png) no-repeat 50% 50%;
}
.selectbox > div span i {
    background:white;
    display:inline-block;
    border:2px solid #777;
    width:14px;
    height:14px;
    margin:0 8px 1px 0;
    vertical-align:middle;
}
.selectbox > div span {
    display:block;
    padding:5px 10px;
    padding-right:20px;
    font-size:16px;
    vertical-align:middle;
}
.selectbox > .close {
    display:none;
}
.selectbox.showed.mob > .close {
    display:block;
    position:fixed;
    top:10%;
    right:10%;
    height:30px;
    line-height:30px;
    text-align:center;
    width:110px;
    margin-top:-30px;
    background:black;
    color:white;
    z-index:900;
}
.selectbox.showed.mob > div.sb-list {
    position:fixed;
    max-height:80%;
    left:10%;
    right:10%;
    top:10%;
    border-top:1px solid #b3b3b3;
}
.selectbox.showed > div.sb-list {
    display:block;
    max-height:300px;
    overflow-x:hidden;
    overflow-y:auto;
}
.selectbox.showed > span,
.selectbox.showed {
    background-color:#f4f4f4;
}
.selectbox > div.sb-list {
    display:none;
    position:absolute !important;
    z-index:300;
    background:#f4f4f4;
    width:auto;
    min-height:10px;
    min-width:200px;
    border:1px solid #b3b3b3;
    margin-left:-4px;
    border-top:1px solid #ddd;
    box-shadow:1px 2px 2px rgba(0,0,0,0.2);
    border-radius:0 0 3px 3px;
}
.selectbox > span {
    background:url(../images/forms/drop-arrow.png) no-repeat 50% 50%,
                #eee url(../images/forms/button_top.png) repeat-x;
    width:30px;
    height:26px;
    margin:0px 0 0 -30px;
    border-radius:0 3px 3px 0;
    display:inline-block;
    vertical-align:middle;
    position:absolute;
}
.selectbox > i {
    display:inline-block;
    width:100%;
    line-height:26px;
    height:26px;
    overflow:hidden;
    vertical-align:middle;
    font-size:16px;
    font-style:normal;
}
.selectbox * {
    vertical-align:top;
}
u.input .selectbox {width:100%;}
.selectbox {
    display:inline-block;
    min-width:120px;
    padding-left:7px;
    white-space:nowrap;
    border-radius:3px;
    border:1px solid #aaa;
    border-bottom:1px solid #777;
    background:#eee url(../images/forms/button_top.png) repeat-x;
    border-radius:3px;
    overflow:hidden;
    cursor:pointer;
}*/

/* Ползунок */
div.form u.slider {
    display:block;
    position:absolute;
    right:10px;
    top:25px;
    bottom:5px;
}
div.form u.slider button {
    position:absolute;
    top:10%;
    width:12px !important;
    height:80%;
    display:block;
    left:0;
    line-height:0;
    padding:0;
    z-index:200;
}
div.form u.slider a {
    cursor:pointer;
    display:block;
    position:absolute;
    left:0; right:0;
    top:45%; height:10%;
    border-radius:3px;
    border:1px solid #7e7e7e;
    border-bottom-color:#f5f5f5;
    border-right-color:#f5f5f5;
    background:#deedf7 url("../images/forms/input_top.png") repeat-x 0 100%;
}
/* ~Ползунок */

/* календарь */
div.calendar {
    width:auto;
    margin-top:-2px;
    min-height:50px;
    background:#fff;
    border:1px solid #7e7e7e;
	border-radius:3px 3px;
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
    position:absolute;
    padding:2px;
    z-index:252;
    display:none;
}
div.calendar .title button img {margin:0 !important;}
div.calendar .title button {width:21px; height:20px; display:inline-block; vertical-align:top; margin:2px 3px; padding:0; font-size:11px; background-color:#fff;}
div.calendar .title button.left {
    border-radius:3px 0 0 3px;
    margin-right:0;
}
div.calendar .title button.right {
    border-radius:0 3px 3px 0;
    border-left:1px solid rgba(255,255,255,0.3) !important;
    margin-left:0;
}
div.calendar span.val {
    font-size:14px;
    padding:0;
    line-height:18px;
    height:18px;
    display:inline-block;
    vertical-align:top;
    margin:2px 0;
    border:1px solid #7e7e7e;
    border-left-color:rgba(255,255,255,0.3);
    background: url("../images/button_bottom.png") repeat-x 0 100%, #fff url("../images/button_top.png") repeat-x;
    width:70px;
}
div.calendar .title {color:black; cursor:default; text-align: center; padding:5px 0;}
div.calendar .title img {cursor:pointer; margin:0 5px;}
div.calendar .title:hover {background:none;}

div.calendar .time input {
    width:80px;
}
div.calendar .time {
    vertical-align: middle;
    padding:0 20px;
}

div.calendar .table {width:220px; margin:0 5px;}
div.calendar .table td {padding:3px 3px 1px; color:black; text-align:center; cursor:pointer; border-radius: 3px;}
div.calendar .table td.weekends {color:#e22;}
div.calendar .table td:hover {background:#57e; color:white;}
div.calendar .table td.current {font-weight:bold;}
div.calendar .table td.before {color:#777;}
div.calendar .table td.before:hover {color:white !important;;}
div.calendar .table td.empty {cursor:default;}
div.calendar .table td.empty:hover {background:none;}
div.calendar .table td.newselect {
    text-decoration:underline;
    background:#f33;
    color:white !important;
}
div.calendar .table td.select {text-decoration:underline; background:#333; color:white !important;}
div.calendar tr.days td,div.calendar tr.days td:hover
    {background:none; font-size:11px; border-bottom:1px solid silver; cursor:default; color:#333;}
/* ~календарь */

/* AJAX ошибки и сообщения */
#ajax_info {
    background:#fefefe;
    border:1px solid #999;
    left:40%; top:40%;
    width:20%;
    max-height:50%;
    padding:10px;
    border-radius:5px;
    box-shadow:0 0 10px rgba(0,0,0,0.1);
    z-index:220;
    position:absolute;
    overflow:auto;
    display:none;
}
#ajax_info p.error, #ajax_info p.warning, #ajax_info p.info {
    background:url("../images/medium/error.png") no-repeat;
    padding-left:30px;
}
#ajax_info p.warning {background-image:url("../images/medium/warning.png");}
#ajax_info p.info {background-image:url("../images/medium/info.png");}
#ajax_info p {
    margin-bottom:5px;
    padding:3px 0 10px;
}
/* ~AJAX ошибки и сообщения */

/* Прогресс бар */
.progress_bar {
    background:white;
    border:1px solid #999;
    left:42%; top:40%;
    width:16%;
    height:20px;
    border-radius:5px;
    box-shadow:0 0 10px rgba(0,0,0,0.2);
    z-index:250;
    position:absolute;
    display:none;
}
.progress_bar div {
    background:#eee url("../images/input_top.png") repeat-x;
    left:2px; top:2px; right:2px; bottom:2px;
    border-radius:3px;
    position:absolute;
}
.progress_bar span {
    background:#50bf60 url("../images/progress.png") repeat-x;
    width:10%;
    border-radius:3px;
    display:block;
    height:16px;
    position:absolute;
}
.progress_bar b {
    font-weight:normal;
    text-align:center;
    font-size:13px;
    text-shadow:1px 1px 0 rgba(0,0,0,0.8);
    color:white;
    z-index:250;
    width:100%;
    display:block;
    position:absolute;
}

/* ~Прогресс бар */